页面事件

@PageEvent
下拉刷新 onPullDownRefresh
页面重新初始化
部分逻辑初始化
真机下不能自动返回,需要显式的调用wx.stopPullDownRefresh(Object object)
需要在配置文件中开启
更多信息,请查看 官方文档 - onPullDownRefresh
"enablePullDownRefresh": true
在Page顶级top-level中使用
onPullDownRefresh() {
    //
}
触底加载 onReachBottom
加载更多数据,如拉取下一分页数据
每次触底都会触发 - 节流、懒加载
每次拉取的新数据,都叠加到之前的数据上
拉取完毕后,应停止
更多信息,请查看 官方文档 - onReachBottomlazyLoadscroll滚动加载
在Page顶级top-level中使用
onReachBottom() {
    //
}
分享|转发 onShareAppMessage
在Page顶级top-level中使用
更多信息,请查看 官方文档 - onShareAppMessage
onShareAppMessage() {
    //
}
节流
焦点1 Focus
触底加载和下拉刷新都涉及到数据拉取;但是:下拉刷新需要手动停止刷新,而触底加载不需要
方案1 Solution
使用标记flag:true为下拉刷新;false为触底加载;在下拉刷新中,传入true;在触底加载中,传入false;如果是下拉刷新,就执行停止下拉刷新效果
_load(flag) {
    wx.request({
        url: this.data.baseUrl + '/good/page?page=' + this.page + '&pageSize=' + this.pageSize,
        success: res => {
            console.log(res);
            this.setData({
                goods: [...this.data.goods, ...res.data],
                total: res.header['X-Total-Count']
            })
            //下拉刷新才执行
            if(flag){
                wx.stopPullDownRefresh()
            }
        },
        fail: err => {
            console.log(err);
        },
        complete: () => {
            console.log('log done');
        }
    })
}
方案2 Solution
使用函数作为参数决定是否要显式停止刷新;传入函数,则执行;否则不执行
本质上,和方案1并没有区别

函数声明 - 根据cb的有无决定是否执行特定操作

_load(cb) {
    //其他逻辑
    cb&cb()
}

函数执行 - 无形参cb,正常执行

this._load()

函数执行 - 有形参cb,执行特定操作

this._load(()=>{
    wx.stopPullDownRefresh()  
})
焦点2 Focus
不管是下拉刷新还是触底加载,在当前加载没有完成之前,不应该再次触发
节流阀初始为false
加载时设置节流阀为true
加载完毕时设置节流阀为false
每次加载时,先判断节流阀是否为false;为false则加载;否则返回
修改加载函数 - 增加静态数据isLoading;在下拉刷新和触底加载中,判断是否为真;为真返回;为假才加载
_load(flag) {
    //开始加载时,为真
    this.isLoading = true
    wx.request({
        url: this.data.baseUrl + '/good/page?page=' + this.page + '&pageSize=' + this.pageSize,
        success: res => {
            console.log(res);
            this.setData({
                goods: [...this.data.goods, ...res.data],
                total: res.header['X-Total-Count']
            })
            //下拉刷新才执行
            if(flag){
                wx.stopPullDownRefresh()
            }
        },
        fail: err => {
            console.log(err);
        },
        complete: () => {
            console.log('log done');
            //加载完毕为假
            this.isLoading = false
        }
    })
}