微信小程序下拉刷新上拉加载

时间:2022-07-24
本文章向大家介绍微信小程序下拉刷新上拉加载,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

下拉刷新

在app.json中

 "window": {
    "backgroundTextStyle": "dark",
  },

在页面的配置项.json中

  "enablePullDownRefresh":true

在页面的js中

  // 触发下拉刷新时执行
  onPullDownRefresh: function () {
    //在标题栏中显示加载
    wx.showNavigationBarLoading();
    //重新加载的方法
    this.getchange();
    // 隐藏导航栏加载框
    wx.hideNavigationBarLoading();
    // 停止下拉动作
    wx.stopPullDownRefresh();
  },

上拉加载

 if (res.data.data.length == 0) {
       this.setData({
         bare: false
       })
     }
     this.setData({
       dynamic_list: this.data.dynamic_list.concat(res.data.data),
     })
  // 页面触底时执行
  onReachBottom: function () {
    if (this.data.bare == false) {
      return false
    }
    let that = this;
    wx.showLoading({
      title: '玩命加载中',
    })
    var page = that.data.page + 1
    that.setData({
      page: page
    })
    //在调一次方法
    that.getdynamic()
    wx.hideLoading();
  },