js中编写触底加载更多数据大致逻辑,根据自身情况稍作修改即可
var app = getApp();
const api = require('../utils/api');
Page({
data: {
dataList: [], //数据列表
pageNum: 1, //页数
pageSize: 12, //每页数据条数
dataBack: true, //触底加载
},
loadMoreData: function() {
var _this = this;
var data = {
pageNum: _this.data.pageNum,
pageSize: _this.data.pageSize
}
// 带页码数请求后台数据
api.getData(data, {
success: res => {
if (typeof(res) == 'object' && 'data' in res ) {
if (res.data.length > 0) {
// 向数组追加数据,并更新列表、页数及触底状态
var newDataList = _this.data.dataList.concat(res.data);
_this.setData({
dataList: newDataList,
pageNum: _this.data.pageNum + 1,
dataBack: true
});
}
}
}
});
},
// 页面上拉触底事件的处理函数
onReachBottom: function () {
if (this.data.dataBack) {
// 调用追加数据方法
this.loadMoreData();
this.setData({
dataBack: false,
});
}
}
})