pp电子

登录
免费开通

小程序转动加载更多功效的实现

小程序转动加载更多是小程序基本的操作功效,,,怎样实现呢?????

1.需要用到的组件和api

scroll-view(可转动视图区域)

wx.showToast(OBJECT)显示新闻提醒窗----显示loading小菊花用的

2.需要用到的属性

小程序转动加载更多功效的实现

3.scrol-view需要指定一个高度,,,这个高度可以按自己的需求盘算,,,一般使用的是屏幕可用高度并且默认一页显示6个

 

4.转动究竟部绑定需要触发的事务


5.操作事务函数,,,主要是将请求下来的数据用concat要领举行合并,,,然后赋值,,,我是用的for循环冒充添加的数据,,,现实项目中可以换成自己的ajax,,,并且为了模拟加载我添加了一个1.5秒的准时器,,,先挪用提醒框api乐成之后关闭

  lower() {
    var result = this.data.res;
    var resArr = [];
  //这里可以使用自己的ajax
    for (let i = 0; i < 10; i++) {
      resArr.push(i);
    };
    var cont = result.concat(resArr);//合并请求的数据
    console.log(resArr.length);
    if (cont.length >= 100) {
      wx.showToast({ //时代为了显示效果可以添加一个太过的弹出框提醒“加载中”  
        title: '我也是有底线的',
        icon: 'success',
        duration: 300
      });
      return false;
    } else {
      wx.showLoading({ //时代为了显示效果可以添加一个太过的弹出框提醒“加载中”  
        title: '加载中',
        icon: 'loading',
      });
      setTimeout(() => {
        this.setData({
          res: cont
        });
        wx.hideLoading();
      }, 1500)
    }
  }

6.乐成,,,放完整代码可以直接复制运行

wxml代码

<scroll-view scroll-y='true'  bindscrolltolower='lower'>
  <view wx:for="{{res}}" data-id="{{index}}" wx:key="{{index}}" >{{item}


小程序工具提供多类型商城/门店小程序制作,,,可视化编辑 1秒天生5步上线。。。。。。通过拖拽、拼接?????榻峁剐〕绦蛏坛且趁,,,所看即所得,,,只需要美工就能做出细腻商城。。。。。。

更多微信小程序相关资讯,,,请前往:/miniprogramschool/


【本站声明】
  1、本站文章中所选用的图片及文字泉源于网络以及用户投稿,,,由于未联系到知识产权人或未发明有关知识产权的挂号,,,若有知识产权人并不肯意我们使用,,,若是有侵权请连忙联系。。。。。。
  2、本网站差池文章中所涉及的内容真实性、准确性、可靠性认真,,,仅系客观性形貌,,,如您需要相识该类商品/服务详细的资讯,,,请您直接与该类商品/服务的提供者联系。。。。。。


KESION pp电子软件

KESION pp电子软件是海内领先的在线教育软件及私域社交电商软件服务提供商,,,恒久专注于为企业提供在线教育软件及社交电商SaaS平台解决方案。。。。。。
公司焦点产品云开店SaaS社交电商服务平台、在线教育SaaS服务平台、教育企业数字化SaaS云平台、企微营销助手、私有化自力安排品牌网校和在线教育咨询等。。。。。。

KESION 一直通过手艺立异,,,提供产品和服务,,,助力企业向数字化转型,,,通过科技驱动商业刷新,,,让商业变得更智慧!



▼点击进入pp电子官网相识更多



热门标签
微信小程序 SaaS
上/下篇
  • 小程序TabBar不泛起怎么办

  • 小程序学科排名开发实例

换一换相关推荐
精选内容
热门精选
pp电子·模拟器(试玩游戏)官方网站 pp电子·模拟器(试玩游戏)官方网站 pp电子·模拟器(试玩游戏)官方网站
【网站地图】
小程序转动加载更多功效的实现 - KESION pp电子