18.小程序上拉加載和下拉刷新
在微信小程序上實現下拉刷新、上拉加載的效果
使用系統提供的onPullDownRefresh、onReachBottom這2個事件，
前提需要在app.json或page.json配置文件中設置，才能使用。
app.json是全應用的頁面都可以使用該事件，page.json則只是對應的頁面才可以使用。
示例：
app.json：
在app.json文件裏設置window屬性
page.json：
在page.json文件裏直接設置屬性
示例：
結合導航欄loading顯示正在加載的效果
Page({
data: {
pageNum: 1, // 設置加載的第幾次，默認是第一次
isFirstLoad: true, // 用於判斷List數組是不是空數組，默認true，空的數組
hasMore: false, // “加載更多”
},
// 下拉刷新
onPullDownRefresh: function () {
// 顯示導航欄loading
wx.showNavigationBarLoading();
// 調用接口加載數據
this.loadData();
// 隱藏導航欄loading
wx.hideNavigationBarLoading();
// 當處理完數據刷新後，wx.stopPullDownRefresh可以停止當前頁面的下拉刷新
wx.stopPullDownRefresh();
},
// 上拉加載
onReachBottom(e) {
let that = this;
if (that.data.hasMore) {
that.setData({
pageNum: that.data.pageNum + 1, // 每次觸發上拉事件，把pageNum+1
isFirstLoad: false // 觸發到上拉事件，把isFirstLoad設為為false
});
that.loadData();
}
},
})
18.小程序上拉加載和下拉刷新