微信小程序使用scroll-view标签 实现列表分页功能
/**
* 页面的初始数据
*/
data: {
list: [],
num: 10, //当前多少页
page: 0, //现在多少页
lastPage: 0, //最后一页
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
this.getData(1); //默认传入第一页
},
//获取列表接口----page..接受实参
getData(page) {
let data = {
num: this.data.num, //需要多少条数据
page, //当前页
}
//接口获取
wxRequest('/**/***/****/****', {}, 'POST', 'loading').then(res => {
//判断接口返回是否有值
if (res.data.data.length) {
//判断是否为第一页
if (page == 1) {
//赋值
this.setData({
list: res.data.data, //列表数据
lastPage: res.data.last_page,
page
})
} else {
//拼接数据concat
this.setData({
list: this.data.list.concat(res.data.data), //拼接列表数据
page
})
}
} else {
//否则置空
this.setData({
list: [], //置空列表数据
})
}
})
},
//触底分页函数
paging() {
//当前页 < 最后页
if (this.data.page < this.data.lastPage) {
//调用列表函数page+1
this.getData(this.data.page + 1)
}
},