公用前端代码
<view class=“post grid” wx:for="{{list}}" wx:key=“id”>
<view class=“headline”>{{item.title}}</view>
</view>
云函数分页方式代码
// 云函数入口文件
const cloud = require(‘wx-server-sdk’)
cloud.init()
const db=cloud.database();
// 云函数入口函数
exports.main = async (event, context) => {
return await db.collection(“hdllinggan”).orderBy(“orderid”,“desc”)
.skip(event.len)//分页
.limit(event.pageNum)//每页加载多少
.get()
}
页面js调用代码
Page({
data: {
list: [],
},
getData(e) {
// console.log(e.currentTarget.dataset.page)
let page = e.currentTarget.dataset.page - 1
console.log(“计算以后的page”, page)
this.getList()
},
getList() {
wx.showLoading({ //设置加载中图标
title: ‘加载中。。。。。’,
})
console.log(“当前list的长度”, this.data.list.length)
let len = this.data.list.length
//调用云函数
wx.cloud.callFunction({
name: "hdllinggan",
data: {
pageNum: 10,//每页加载多少
len: len,//分页用的
}
}).then(res => {
wx.hideLoading() //加载完成后隐藏加载图标
console.log("调用成功", res)
if (res.result.data.length <= 0) { //没有更多数据的友好提示
wx.showToast({
icon: "none",
title: '没有更多数据了',
})
}
this.setData({
// list: res.data
list: this.data.list.concat(res.result.data)
})
}).catch(err => {
wx.hideLoading() //加载完成后隐藏加载图标
console.log("调用失败", err)
})
},
/**
- 生命周期函数–监听页面加载
*/
onLoad: function (options) {
this.getList(0)
},
/**
- 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
this.getList()
},
})