微信小程序--下拉刷新/上拉加载更多

参考文档:https://blog.csdn.net/ruffaim/article/details/78839214

在小程序里,用户顶部下拉是默认禁止的,我们需要把他设置为启用,在app.json中的设置对所有页面有效,在单独页面设置则对当前页面有效;

json文件:

"window": {
    "enablePullDownRefresh": true  // 这里的true是布尔型而不是字符
  },
// 下拉刷新
  onPullDownRefresh: function () {
    // 显示顶部刷新图标
    wx.showNavigationBarLoading();
    var that = this;
    wx.request({
      url: 'https://xxx/?page=0',
      method: "GET",
      header: {
        'content-type': 'application/text'
      },
      success: function (res) {
        console.log(that.data.moment);
        // 隐藏导航栏加载框
        wx.hideNavigationBarLoading();
        // 停止下拉动作
        wx.stopPullDownRefresh();
      }
    })
  },
// 关闭下拉刷新
  onPullDownRefresh: function() {
    wx.stopPullDownRefresh();
  },
/**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    var that = this;
    // 显示加载图标
    wx.showLoading({
      title: '玩命加载中',
    })
    // 页数+1
    page = page + 1;
    wx.request({
      url: 'https://xxx/?page=' + page,
      method: "GET",
      // 请求头部
      header: {
        'content-type': 'application/text'
      },
      success: function (res) {
        // 回调函数--成功
        // 隐藏加载框
        wx.hideLoading();
      }
    })
  },

你可能感兴趣的:(微信小程序--下拉刷新/上拉加载更多)