微信小程序 -分页加载-onReachBottom上拉触底加载
2019-12-05 本文已影响0人
端木安玉
运用到的方法
onReachBottom
当上拉至底部时就会触发onReachBottom函数来进行相应动作。也就是说小程序自带能捕捉到用户触底事件的函数。我们无需再进行捕捉用户事件了!!
data: {
limit: 11,//显示数据量
list: '',
page: 1,//当前页
load: true,
loading: false,//加载动画的显示
},
onReachBottom: function () {
var that = this;
if (that.data.load) {//全局标志位,方式请求未响应是多次触发
if (that.data.list.length < that.data.count) {
that.setData({
load: false,
loading: true,//加载动画的显示
})
wx.request({
url: 'url',
data: {
},
method: 'POST',
success: function (res) {
console.log(res)
var content = that.data.list.concat(res.data.data.list)//将放回结果放入content
that.setData({
list: content,
page: that.data.page * 1 + 1,
load: true,
loading: false,
})
},
fail: function (res) {
that.setData({
loading: false,
load: true,
})
wx.showToast({
title: '数据异常',
icon: 'none',
duration: 2000,
})
},
complete: function (res) { },
})
}
}
}
后台获取到 page 自己添加功能即可