手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

机器人权保
• 阅读 1122

手把手教你搭建答题活动小程序系列文章,最前面的三章是界面设计篇,分别描写了如何搭建答题小程序的首页、答题页和答题成绩页。

现在已经进入功能交互篇了,此为功能交互篇的第三章,如何用云开发实现查询题库功能

其实,说白了就是相当于,前后端分离架构中的发送异步请求。先看看官方文档怎么说,再看看我是怎么理解和怎么做的,希望大家能从中得到启发,然后找到适合自己的学习方法。

软件架构:微信原生小程序+云开发

源码地址,获取源码,版本持续迭代中...

前期准备工作

按照惯例,我们先看看官方文档怎么说。不一定需要通读文档,可以遵循“用到什么查什么”的原则去针对性的查阅文档。此处应该有表情包,鱿鱼兮“看文档”.jpg

关于云开发是什么,云开发能力有哪些,是这样说的,巴拉巴拉~

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

关于数据库是什么,小程序怎么调用,是这样说的,巴拉巴拉~

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

好了,有兴趣的话,其他的你也可以仔细阅读阅读。

不吹不黑,毕竟,微信小程序开发的官方文档,是我看过的官方技术文档中描写最详细的文档

当然,也有的地方一笔带过,我希望它可以更加详细一些。

不成文的分析

云开发能力,包含云数据库、云存储、云函数、云调用等等。可谓五花八门,这么多概念,眼花缭乱,晕乎所以了吧。

其实,大可不必,有的可用可不用。可以组合使用,也可以只用其一,这就“仁者见仁,智者见智”了。而这里,我们使用云数据库的小程序端SDK就行了。

如果你想免费、快速的开发出一个完整的答题小程序项目,用小程序的云开发可能是最好的选择。小程序的云开发所用到的主要是前端开发的知识,是的,你没听错没看错,划重点吧。

从此,摆脱“前端小哥哥小姐姐”、“后端小哥哥小姐姐”笼罩下的阴影,可以硬气一把了,整个项目自己一把梭,solo~

云开发快速查询题库

所谓“兵马未动,粮草先行”。若要调用数据库,则需要先有数据库。这句看似废话,其实是隐喻一系列的操作。

不禁发出灵魂三问:

你开通云开发服务了吗?

你创建数据库集合了吗?

你添加题目数据了吗?

没有?!没有?!没有?!

还有谁

1、手把手教你操作数据库

1)点击微信开发者工具的云开发图标,打开云开发控制台。

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

2)点击数据库图标进入到数据库管理页,点击集合名称右侧的+号图标,就可以创建一个数据集合了。

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

3)这里我们只需要添加一个activityQuestion的集合即可,这个集合就是存放题库用的。

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

4)添加题目数据,或者,导入题库,两种方式均可。

①添加记录,一题一题地手动添加,一题一题地一题一题地......

②导入题库,嗖的一声直接导入事先准备好的题库json文件。

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

5)大佬喝茶哦,不对。大佬,记得设置数据权限吖。不然它默认是“仅创建者可读写”,到时查不到数据就GG了。别跑,你还有bug没改完

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

2、题库的数据库设计

手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

可以清晰地看见,一道题目其实就是对应一条记录。你可以粗暴地理解为,集合里面的记录,类似数组里面的对象。

你创建的每一道题,都会自动生成一个id字段,这个你可以不用管。一道题里面,所包含的字段不外乎就question、option、true、checked这几个。

字段解读:

1)question 题干

2)option 选项

3)true 正确答案

4)checked 该题是否已做

3、小程序端调用数据库

在小程序端调用数据库的方式很简单,我们可以把下面的代码写到一个事件处理函数里,然后直接在页面的生命周期函数里面执行。

其实概括起来,就三步走:

1)先使用 wx.cloud.database()获取数据库的引用(相当于连接数据库);

2)再使用 db.collection()获取集合的引用;

3)再通过 Collection.get 来获取集合里的记录。

项目代码之逐行解读:

// 连接云数据库
const db = wx.cloud.database();
// 获取集合的引用
const activityQuestion = db.collection('activityQuestion');
// 数据库操作符
const _ = db.command;
 
Page({
 
  /**
   * 页面的初始数据
   */
  data: {
    questionList: [], // 题目列表
    index: 0 // 当前题目索引
  },
 
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 获取题库-函数执行
    this.getQuestionList()
  },
 
  // 获取题库-函数定义
  getQuestionList() {
    // 显示 loading 提示框
    wx.showLoading({
      title: '拼命加载中'
    });
    // 构建查询条件
    activityQuestion.where({
      // 指定查询条件,返回带新查询条件的新的集合引用
      true: _.exists(true)
    })
    .get()
    .then(res => {
      // 获取集合数据,或获取根据查询条件筛选后的集合数据。
      console.log('[云数据库] [activityQuestion] 查询成功')
      console.log(res.data)
      let data = res.data || [];
      
      // 将数据从逻辑层发送到视图层,通俗的说,也就是更新数据到页面展示
      this.setData({
        questionList:data,
        index: 0
      });
 
      // 隐藏 loading 提示框
      wx.hideLoading();
    })
  }
})

4、题库查询结果

保存然后待代码编译之后,点击“开始答题”按钮跳转到答题页面,就能在控制台看到调用的 20 条数据库记录了。

稍微要说明一下的是,如果没有指定 limit,则默认最多取 20 条记录。
手把手教你搭建消防安全答题小程序-用云开发实现查询题库功能

点赞
收藏
评论区
推荐文章
胡哥有话说 胡哥有话说
4年前
微信小程序支付功能全流程实践
前言微信小程序为电商类小程序,提供了非常完善、优秀、安全的支付功能。在小程序内可调用微信的API完成支付功能,方便、快捷。小程序开发者在开发小程序时,支付流程是必然要接触到,今天胡哥就小程序支付的全流程为大家一一细说,让小伙伴能快速得掌握小程序支付能力,避免踩坑!知己知彼,方能百战不殆小程序支付流程图小程序支付交互流程图(https:/
WeiSha100 WeiSha100
2年前
开源线上刷题软件系统
一个开源的刷题系统,可以用于线上学习,除刷题功能外,还有视频点播,直播,考试等功能,有源代码,可以做二次开发,有部署教程,很快就搭建好了,安利给需要的朋友!1、刷题:可批量管理上传试题的题库,有章节练习,错题回顾,高频错题,记笔记,收藏,统计答题正确率,保存进度等功能2、视频点播:在线点播视频,可上传图文资料,习题等3、直播:对接七牛云端口,千人在线流畅直播
梁君牧 梁君牧
4年前
操作系统-简答题-合集
操作系统简答题合集(一)操作系统引论1.简述操作系统的功能?答:操作系统是计算机资源的管理者。主要有处理机管理、存储管理、设备管理、文件管理。此外,操作系统还为用户提供使用操作系统硬件系统的接口,分别是命令接口、程序接口、图形接口。操作系统的四个基本特征是并发、共享、异步、虚拟。2.解释以下术语:资源、多道程序
Dax Dax
4年前
如何使用vue中的nextTick
其实这个问题主要就是针对Vue的异步更新队列的理解,因为我们平时用的也比较少,所以很多时候都会忽略掉,但是如果我们在面试当中能比较详细的解答这个问题,那么我相信这应该会是一个闪光点,那话不多说,我们先来捋一下答题思路:答题思路:nextTick是什么?先来一个定义为什么需要他呢?异步更新队列实现原理解释什么地方使用到他呢?描述使用的场景如何使用他呢?描述使用
WeiSha100 WeiSha100
2年前
考试系统源码搭建
开源考试系统,可以模拟测试,正式考试,后台调取学员学习情况,批量导出学习成绩。支持外网和局域网私有化部署,搭建在自己的服务器上,使用自己的域名。1、创建专业和课程2、题库导入试题,可单个增加试题或excel批量导入试题,支持五种题型:单选,多选,判断,简答,填空,试题增加或导入时写上解析,答题时无论对错都会显示解析3、创建试卷,可按课程或者章节组卷,每个课程
美凌格栋栋酱 美凌格栋栋酱
4个月前
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(
陈杨 陈杨
3星期前
HarmonyOS5云服务技术分享--云函数创建配置指南
大家好!今天咱们来一起探索如何在华为HarmonyOS的AGC云函数服务中创建和配置函数,手把手教你用HTTP触发器玩转云函数。无论你是刚入门还是想优化现有功能,这篇指南都会给你清晰的指引,咱们直接上干货!👇🌟一、云函数能做什么?云函数就像你的"云端小
陈杨 陈杨
3星期前
HarmonyOS5云服务技术分享--云存储指南
Hi各位开发者伙伴们!今天咱们来聊一聊HarmonyOS云存储的实战玩法,手把手教你实现文件上传、下载、元数据操作等核心功能。无需官方文档的严肃感,咱们用最接地气的方式搞懂这些API怎么用!(文末附完整代码示例)一、云存储功能速览HarmonyOS云存储就
WeiSha100 WeiSha100
2年前
源码学习网站建设
有点播,直播,在线支付,三级分销等功能,可以对学员学习情况的监督监控,有源码,可二次开发。支持外网和局域网私有化部署,经过测试源码完整可用!1、视频点播:视频播放,图文资料,课件下载,章节试学,限时免费2、在线题库:章节练习,错题回顾,高频错题,笔记,收藏,答题正确率,进度保存,模拟测试,试题批量导入导出3、在线考试:定时考试,时间段考试,成绩导出,主观阅卷
WeiSha100 WeiSha100
2年前
师德教育培训网站搭建(开源)
有点播,题库,考试,学情监督,直播,在线支付,三级分销,学习卡等功能,可以对学员学习情况的真实有效监督,支持外网和局域网私有化部署,有源码,可二次开发,经过测试完整可用!1、视频点播:视频播放,图文资料,课件下载,章节试学,限时免费2、在线题库:章节练习,错题回顾,高频错题,笔记,收藏,答题正确率,进度保存,模拟测试,试题批量导入导出3、在线考试:定时考试,
WeiSha100 WeiSha100
2年前
源码搭建教师资格考试学习培训系统
有点播,题库刷题,在线考试,直播,在线支付,三级分销等功能,可以对学员学习情况的监督监控,有源码,可二次开发。支持外网和局域网私有化部署,经过测试源码完整可用,用于搭建一个线上教师资格相关学习网站挺不错的!1、点播:视频播放,图文资料,课件下载,章节试学,限时免费2、题库刷题:章节练习,错题回顾,高频错题,笔记,收藏,答题正确率,进度保存,模拟测试,试题批量
机器人权保
机器人权保
Lv1
有趣的人生就要一路撒野狂奔。
文章
3
粉丝
0
获赞
0