上拉加载
1.新建云函数。通过skip、limit、orderBy子句获取数据。
cloud.init()
// 云函数入口函数
exports.main = async (event, context) => {
return await cloud.database().collection('playlist')
.skip(event.start)
.limit(event.count)
.orderBy('CreateTime','desc')
.get()
.then(res=>{
return res
})
}
2.本地编写函数。调用云函数,传递参数。查询云数据库起始Row为本地数组列表的长度 this.data.playlist.length;查询结果要累加至本地数组列表 this.data.playlist.concat(res.result.data),
const MAX_LIMIT=15
_getPlayList(){
wx.showLoading({
title: '加载中...',
})
wx.cloud.callFunction({
name:'onLinePlayList',
data:{
start:this.data.playlist.length,
count:MAX_LIMIT
}
}).then(res=>{
console.log(res.result.data)
this.setData({
playlist:this.data.playlist.concat(res.result.data)
})
wx.stopPullDownRefresh()
wx.hideLoading()
})
},
3.onReachBottom事件调用_getPlayList函数。this._getPlayList函数()
下拉刷新
1.JSON文件中添加"enablePullDownRefresh": true
2.onPullDownRefresh事件清除数组列表内容,调用_getPlayList函数 this.setData({playlist:[]}) this._getPlayList()
3._getPlayList函数中添加 wx.stopPullDownRefresh() ,防止下拉后界面没有回弹。