小程序

分页加载

2018-07-24  本文已影响0人  LuckyS007

思路:
当页面滑动到底部是,加载更多数据,如果无数据,停止加载提示已经到底。
1.设置页面数和显示的数据数量。
2.利用小程序自带的方法:onReachBottom在里面添加条件。当到底时,页面数加1,再请求数据。
3.当数据或者数据全部加载完时,停止加载事件。

data:{
follow_info:[];
isAllFollowData:false;
pageNumber :1;
rowsPerPage:10
}
/**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    if (!this.data.isAllFollowData) {
      var pageNumber = this.data.pageNumber + 1;
      this.setData({
        pageNumber: pageNumber
      });
      app.checkSessionKey(this.getFollowList_fn);
    }

  },
请求成功:
success: function (res) {
        if (res.data.code == 200) {
          if (res.data.data && res.data.data.length>0){
            var follow_info = self.data.follow_info;
//注意这一部,把数据都显示出来
            follow_info.push(...res.data.data);
            self.setData({
              follow_info: follow_info,
            })
            if (res.data.data.length < rowsPerPage) {
              self.setData({
                isAllLoad: true
              })
            }
          } else {
            self.setData({
              isAllFollowData: true
            })
          }
        }
      },
上一篇下一篇

猜你喜欢

热点阅读