投票评选活动小程序连接云数据库,读取评选人物列表
投票评选活动小程序连接云数据库,读取评选人物列表
1、首先在云开发控制台的数据库,创建voteWorks集合;
2、在voteWorks数据集合,设计表的数据结构;
3、配置好数据访问权限;
4、在小程序端连接云数据库,读取评选人物列表;
关键代码如下:
// 连接云数据库
const db = wx.cloud.database();
// 获取集合的引用
const voteWorks = db.collection('voteWorks');
// 数据库操作符
const _ = db.command;
// 显示 loading 提示框
wx.showLoading({
title: '拼命加载中'
});
// 数据库集合的聚合操作实例
voteWorks
.where({
_id: _.exists(true)
})
.orderBy('name', 'desc')
.get()
.then(res => {
// 获取集合数据,或获取根据查询条件筛选后的集合数据。
let data = res.data || [];
// 将数据从逻辑层发送到视图层,通俗的说,也就是更新数据到页面展示
this.setData({
participantList:data
});
// 隐藏 loading 提示框
wx.hideLoading();
})
5、通过接口获取到数据库的真实数据后,通过this.setData()将数据从逻辑层发送到视图层,通俗的说,也就是更新数据到页面展示;
页面渲染效果:
6、为了增强用户体验,我们通常会在请求数据的时候,wx.showLoading()显示 loading 提示框,目的是告诉用户目前的状态是请求数据中,让用户耐心等待一下;
7、页面渲染结束后,需主动调用 wx.hideLoading 才能关闭提示框,表示已经加载完毕。
投票评选活动小程序连接云数据库,读取评选人物列表,到渲染页面的整个过程,大致是这样。
这篇好文章是转载于:学新通技术网
- 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
- 本站站名: 学新通技术网
- 本文地址: /boutique/detail/tanhibecca
系列文章
更多
同类精品
更多
-
photoshop保存的图片太大微信发不了怎么办
PHP中文网 06-15 -
word里面弄一个表格后上面的标题会跑到下面怎么办
PHP中文网 06-20 -
photoshop扩展功能面板显示灰色怎么办
PHP中文网 06-14 -
《学习通》视频自动暂停处理方法
HelloWorld317 07-05 -
TikTok加速器哪个好免费的TK加速器推荐
TK小达人 10-01 -
Android 11 保存文件到外部存储,并分享文件
Luke 10-12 -
微信公众号没有声音提示怎么办
PHP中文网 03-31 -
excel下划线不显示怎么办
PHP中文网 06-23 -
微信运动停用后别人还能看到步数吗
PHP中文网 07-22 -
excel打印预览压线压字怎么办
PHP中文网 06-22