js:
commentData:存放请求接口的数据的数组;
isPageHave:用来判断是否存在下一页;
onReachBottom:微信小程序自定义的页面上拉触底事件;
提示:
如果在使用scroll-view时,onReachBottom事件不生效时,使用scroll-view的bindscrolltolower事件来执行页面上拉触底事件。
Page({
data: {
// 存放请求接口数据的数组
commentData: [],
// 分页
page: 1,
pageSize: 10,
isPageHave: true,
},
onLoad: function (options) {
// 调用接口
this.listData();
},
// 封装请求接口
listData(){
var _this1 = this;
this.$request({
url: '请求接口数据',
type: 'GET',
param: {
id: '12',
page: _this1.data.page,
pageSize: _this1.data.pageSize
}
}).then(function (res) {
if(res.data.length != 0){
_this1.setData({
isPageHave: true,
commentData: _this1.data.commentData.concat(res.data)
})
}
if(res.data.length == 0){
wx.showToast({
title: '没有更多数据了',
icon: 'none'
})
_this1.setData({
isPageHave: false,
commentData: _this1.data.commentData.concat(res.data)
})
}
})["catch"](function (error) {
console.log(error, 'error');
})
},
// 页面上拉触底事件的处理函数
onReachBottom: function () {
if(this.data.isPageHave){
this.data.page += 1;
// 调用接口数据
this.listData();
}
},
})