小程序实现触底加载功能

*.js

const app = getApp();
Page({
  data: {
    page: 1, //当前页数
    "newslist": {}, // 数据组
  },
  onLoad: function (options) {
    var page = this.data.page;
    app.getAjax('api/article', { page: page}, this.callback); // 自定义ajax请求方法
  },
  callback: function(res){
    var that = this;
    that.setData({
      newslist: res.data
    })
  },
  // 上拉加载
  onReachBottom: function(){
    var that =this;
    // 显示加载图标
    wx.showLoading({
      title: '数据加载中',
    })
    var arr = that.data.newslist; // 获取原先数据
    var page = that.data.page+1; // 每次刷新页数+1
    that.setData({
      page: page
    })
    
    wx.request({
      url: 'http://192.168.1.100/api/article',
      header: {
        'content-type': 'application/x-www-form-urlencoded',
      },
      method: 'POST',
      data: { page: page},
      dataType: 'json',
      success: function (res) {
      // 判断数据是否已全部加载完成
        if(res.data.data.length <= 0){
          wx.showToast({
            title: '数据已全部加载完成',
          })
          return;
        }
        // 将新数据追加到原数据后
        for(var i=0; i< res.data.data.length; i++){
          arr.push(res.data.data[i]); 
        }
        that.setData({
          newslist: arr
        })
        wx.hideLoading(); // 隐藏加载动画
      }
    })
  }
})