方法一
首先说明小程序的两个事件
<1>页面相关事件处理函数–监听用户下拉动作
onPullDownRefresh: function () { },
<2>页面上拉触底事件的处理函数
onReachBottom: function () { },
监听用户下拉动作
onPullDownRefresh: function () { console.log(‘下拉刷新…‘); wx.showNavigationBarLoading() //在标题栏中显示加载 this.data.pageNo = 1 // 刷新并初始化数据 this.getdata(); //延时处理数据 setTimeout(() => {
//关闭加载 wx.hideNavigationBarLoading(); wx.stopPullDownRefresh(); }, 1000); },
监听上拉触底动作
onReachBottom: function () { //上拉分页,将页码加1,然后调用分页函数loadRoom() var that = this; var pageNo = that.data.pageNo; that.setData({ pageNo: ++pageNo }); wx.showToast({ title: ‘加载中..‘, icon: ‘loading‘ }), setTimeout(function () { that.loaddata(); }, 1000) },
注意:
项目需求如果上拉触底是在原有数据基础上,在数据集合后面继续追加数据,可以在数据加载的接口中这样写
if (i.state == 200) { console.log(i.data) //这个地方判断当前pageNo是否已经大于1 if (that.data.pageNo > 1) { //定义一个aa变量,将之前的数据赋值给aa let aa = that.data.mydata //通过循环继续往aa里追加数据 for (let index = 0; index < i.data.length; index++) { const element = i.data[index]; aa.push(element) } that.setData({ mydata: aa}) } else if (that.data.pageNo == 1) { let aa = []; for (let index = 0; index < i.data.length; index++) { const element = i.data[index]; aa.push(element) } that.setData({mydata: aa}) } console.log(that.data.mydata) } else { wx.showToast({ title: i.data.msg, icon: ‘none‘ })
}