微信小程序云开发实现数据添加、查询、分页

本文的例子分享了微信小程序云的开发，实现数据的添加、查询和分页，供大家参考。具体内容如下

达到的效果

实现要点

在WXML中显示不同类别的数据

由if-elif-else实现，在wxml文件中由block/block呈现，因为它只是一个打包元素，不会呈现任何页面，只接受控件属性。也就是说，页面是否应该呈现这部分内容可以通过属性来控制，这样可以减少页面呈现时间。云开发数据的获取

先打开云开发功能，参考官方文档，然后在创建项目时检查云开发模板的使用情况(看个人，我会直接使用，在项目中点击登录)获取用户的oppenid，然后使用云数据库。

云开发登录：

云数据的获取

/* * *生命周期函数-监控页面加载*/onload :函数(选项){ console . log(' on load ')；this . getdata(this . data . page)；}，/* * *获取列表数据* */getdata:函数(page) {var即=thisconsole . log(' page-' page)；const db=wx . cloud . database()；//获取总db.collection ('topic ')。count({ success : function(RES){ that . data . total count=RES . total；} })//获取前十个尝试{db.collection ('topic ')。其中({ _ OpenID : ' osly * * * * * * * * vu1kwze '，//填写当前用户OpenID})。limit(that . data . page size)//将返回次数限制为10。orderBy('date ')，Get({ success : function(RES){//RES . data是一个数组，包含上面定义的两个记录//console.log (res.data)，即. data . topics=RES . data；that . setdata({ topics : that . data . topics，})wx . HidenavigationBarLoading()；//隐藏加载wx.stopPullDownRefresh}，fail:函数(事件){ wx . HidenavigationBarLoading()；//隐藏加载wx.stopPullDownRefresh} })} catch(e){ wx . hidenavigationbarloading()；//隐藏加载wx.stopPullDownRefreshconsole . error(e)；}}，添加云数据

/* * *保存到发布集合*/保存数据到服务器：函数(事件){ var=this；const db=wx . cloud . database()；const topic=db . collection(' topic ')db . collection(' topic ')。add ({//data字段指示JSON数据： { content : that . data . content，date: new Date()，images: that.data.images，user: that.data.user，isLike: that.data.isLike，}，Success3360function (res) {//res是一个对象，其中_id字段标记了新创建记录的id。//清空它，然后将其重定向到第一页console . log(' success-RES)//并将其保存到发布历史记录中，即. savetohistoryserver()；//清空数据，即. that.data.content=that . data . images=[]；that . setdata({ textcontents : ' '，images: []，})that . showtipandswitchtab()；}，完成：功能(RES){ console . log(' complete-' RES)} })，删除云数据

你可以查看官方文件。这里没有张贴任何代码。如果您有任何问题，请联系我们。

云数据的更新

你可以查看官方文件。这里没有张贴任何代码。如果您有任何问题，请联系我们。

数据列表分页

主要是定义一个临时数组来存储加载的数据，然后将其传递给对象，最后传递给布局。

/** * 页面上拉触底事件的处理函数*/onReachBottom:函数(){ var=thisvar temp=[]；//获取后面十条如果(这个。数据。话题。长度这个。数据。总计数){ try { const db=wx。云。database()；db.collection(“主题”).跳过(5)。limit(that.data.pageSize) //限制返回数量为5条orderBy('date '，' desc') //排序获取({成功：函数(res) { //res.data是包含以上定义的两条记录的数组if(RES .数据。长度0){ for(var I=0；一、资源数据。长度；I){ var tempTopic=RES . data[I]；控制台。日志(tempTopic)；在…之时push(tempTopic)；} var totalTopic={ } total topic=that。数据。话题。concat(temp)；控制台。日志(TotalTotopic)；那个。setdata({ topics : TotalTotopic，})else { wx。showToast({ title : '没有更多数据了，}) }，fail:函数（事件){ console.log('====='事件);} })} catch(e){ console。错误(e)；} } else { wx。ShowToast({ title : '没有更多数据了', }) } },以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。