使用系統(tǒng)提供的onPullDownRefresh、onReachBottom這2個(gè)事件，

前提需要在app.json或page.json配置文件中設(shè)置，才能使用。

app.json是全應(yīng)用的頁(yè)面都可以使用該事件，page.json則只是對(duì)應(yīng)的頁(yè)面才可以使用。

屬性

類型

默認(rèn)值

描述

enablePullDownRefresh

Boolean

false

是否開(kāi)啟下拉刷新。

示例：

app.json：

在app.json文件里設(shè)置window屬性

{
  "window":{
"enablePullDownRefresh": true
  }
}

page.json：

在page.json文件里直接設(shè)置屬性 

{
    "enablePullDownRefresh": true
}

示例：
可以結(jié)合導(dǎo)航欄loading顯示正在加載的效果

Page({
  data: {
    pageNum: 1,       // 設(shè)置加載的第幾次，默認(rèn)是第一次
    isFirstLoad: true,   // 用于判斷List數(shù)組是不是空數(shù)組，默認(rèn)true，空的數(shù)組
    hasMore: false,    // “加載更多”
  },
  // 下拉刷新
  onPullDownRefresh: function () {
    // 顯示導(dǎo)航欄loading
    wx.showNavigationBarLoading();
    // 調(diào)用接口加載數(shù)據(jù)
    this.loadData();
    // 隱藏導(dǎo)航欄loading
    wx.hideNavigationBarLoading();
    // 當(dāng)處理完數(shù)據(jù)刷新后，wx.stopPullDownRefresh可以停止當(dāng)前頁(yè)面的下拉刷新
    wx.stopPullDownRefresh();
  },
  // 上拉加載
  onReachBottom(e) {
    let that = this;
    if (that.data.hasMore) {
      that.setData({
        pageNum: that.data.pageNum + 1,  // 每次觸發(fā)上拉事件，把pageNum+1
        isFirstLoad: false                // 觸發(fā)到上拉事件，把isFirstLoad設(shè)為為false
      });

      that.loadData();
    }
  },
})