开发工具mpvue官方文档 云开发初始化[代码] [代码] [代码]   wx.cloud.init({[代码] [代码]    [代码][代码]env: [代码][代码]'wedding-10c111'[代码][代码]  })[代码] [代码] [代码] 上面这段代码配置在src目录下的main.js文件中 数据库API（不使用云函数进行增删改查）以下说明均写在对应代码注释里，不清楚的请查看相关注释 查（获取数据）[代码] [代码] [代码]   // 获取轮播图列表[代码] [代码]  getBannerList () {[代码][代码]    [代码][代码]// 获取数据库引用[代码][代码]    [代码][代码]const db = wx.cloud.database()[代码][代码]    [代码][代码]// 获取名为“banner”的集合引用[代码][代码]    [代码][代码]const banner = db.collection([代码][代码]'banner'[代码][代码])[代码][代码]    [代码][代码]// 获取集合（Promise 风格）[代码][代码]    [代码][代码]banner.get().then(res => {[代码][代码]      [代码][代码]this[代码][代码].list = res.data[0].bannerList[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] 对应实例如下：  [图片] 注意：之所以数据库只有一条数据，而把banner列表当成这条数据的一个字段存储，其目的是为了自己后续换图操作的方便 增（添加数据）[代码][代码][代码]  [代码] [代码]   // 添加用户[代码] [代码]  addUser () {[代码][代码]    [代码][代码]// 获取数据库引用[代码][代码]    [代码][代码]const db = wx.cloud.database()[代码][代码]    [代码][代码]// 获取名为“user”的集合引用[代码][代码]    [代码][代码]const user = db.collection([代码][代码]'user'[代码][代码])[代码][代码]    [代码][代码]// 向“user”集合中添加一条数据（Promise 风格）[代码][代码]    [代码][代码]user.add({[代码][代码]      [代码][代码]data: {[代码][代码]        [代码][代码]user: that.userInfo,[代码][代码]        [代码][代码]// 构造一个服务端时间的引用，我的项目中都是取自己转化后的时间，[代码][代码]        [代码][代码]// 取这个时间更加合理，可用于查询条件、更新字段值或新增记录时的字段值[代码][代码]        [代码][代码]time: db.serverDate()[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]}).then(res => {[代码][代码]      [代码][代码]// 添加成功后重新查询列表[代码][代码]      [代码][代码]that.getUserList()[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] 对应实例如下：  [图片] 注意： 可以看出_id和_openid是添加完自动生成的属性 改（修改数据）[代码]  [代码] [代码]   // 改变某条留言的显示隐藏[代码] [代码]  switchMessage (e) {[代码][代码]    [代码][代码]// 获取数据库的引用[代码][代码]    [代码][代码]const db = wx.cloud.database()[代码][代码]    [代码][代码]// 获取名为“message”的集合的引用[代码][代码]    [代码][代码]const message = db.collection([代码][代码]'message'[代码][代码])[代码][代码]    [代码][代码]// 这里的id是拿到当前操作项对应的id，[代码][代码]    [代码][代码]// 这里的show对应change事件传递过来的值[代码][代码]    [代码][代码]message.doc(e.mp.target.dataset.id).update({[代码][代码]      [代码][代码]data: {[代码][代码]        [代码][代码]show: e.mp.detail.value[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]}).then(res => {[代码][代码]      [代码][代码]console.log(res)[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] 对应实例如下： [图片] 注意：这个界面在你们使用的小程序中是看不到的，只有本人才有权限查看  [图片] [代码] [代码] [代码]   <[代码][代码]switch[代码] [代码]class[代码][代码]=[代码][代码]"switch"[代码] [代码]:data-id[代码][代码]=[代码][代码]"item._id"[代码] [代码]:checked[代码][代码]=[代码][代码]"item.show"[代码] [代码]@[代码][代码]change[代码][代码]=[代码][代码]"switchMessage"[代码][代码]></[代码][代码]switch[代码][代码]>[代码] [代码] [代码]  注意：上面我们之所以能得到e.mp.target.dataset.id是因为在<switch>标签上加了`:data-id="item._id"`，不然取不到对应id 删（删除数据）正好对应的上图有删除操作 [代码]  [代码] [代码]   deleteItem (id) {[代码] [代码]    [代码][代码]// 记录this指向[代码][代码]    [代码][代码]const that = [代码][代码]this[代码][代码]    [代码][代码]// 这里之所以使用wx.showModal是防止误操作[代码][代码]    [代码][代码]wx.showModal({[代码][代码]      [代码][代码]title: [代码][代码]'提示'[代码][代码],[代码][代码]      [代码][代码]content: [代码][代码]'你确定要删除这条留言？'[代码][代码],[代码][代码]      [代码][代码]success (res) {[代码][代码]        [代码][代码]if[代码] [代码](res.confirm) {[代码][代码]          [代码][代码]// 获取数据库的引用[代码][代码]          [代码][代码]const db = wx.cloud.database()[代码][代码]          [代码][代码]// 获取名为“message”集合的引用[代码][代码]          [代码][代码]const message = db.collection([代码][代码]'message'[代码][代码])[代码][代码]          [代码][代码]// 删除操作（Promise 风格）[代码][代码]          [代码][代码]message.doc(id).remove().then(res => {[代码][代码]            [代码][代码]// 删除成功后再次请求列表，达到刷新数据的目的[代码][代码]            [代码][代码]if[代码] [代码](res.errMsg === [代码][代码]'document.remove:ok'[代码][代码]) {[代码][代码]              [代码][代码]that.getList()[代码][代码]            [代码][代码]}[代码][代码]          [代码][代码]})[代码][代码]        [代码][代码]}[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] 使用云函数进行增删改查 查（获取数据）[代码]  [代码] [代码]   // 云函数初始化[代码] [代码]  const cloud = require([代码][代码]'wx-server-sdk'[代码][代码])[代码][代码]  // 由于文章开始已经讲过初始化步骤，这里init(options)的options可以省略[代码][代码]  // options参数定义了云开发的默认配置，该配置会作为之后调用其他所有云 API 的默认配置[代码][代码]  cloud.init()[代码][代码]  // 获取数据库的引用[代码][代码]  const db = cloud.database()[代码][代码]  exports.main = async (event, context) => {[代码][代码]    [代码][代码]// 将集合名定义成一个变量，方便后续调用[代码][代码]    [代码][代码]const dbName = [代码][代码]'message'[代码][代码]    [代码][代码]// filter为指定的筛选条件，配合where()使用[代码][代码]    [代码][代码]const filter = event.filter ? event.filter : [代码][代码]null[代码][代码]    [代码][代码]// pageNum如果小程序端未传入则默认为1[代码][代码]    [代码][代码]const pageNum = event.pageNum ? event.pageNum : 1[代码][代码]    [代码][代码]// pageSize如果小程序端未传入则默认是10[代码][代码]    [代码][代码]const pageSize = event.pageSize ? event.pageSize : 10[代码][代码]    [代码][代码]// 数据库满足filter条件的数据总条数[代码][代码]    [代码][代码]const countResult = await db.collection(dbName).where(filter).count()[代码][代码]    [代码][代码]const total = countResult.total[代码][代码]    [代码][代码]// 共多少页[代码][代码]    [代码][代码]const totalPage = Math.ceil(total / pageSize)[代码][代码]    [代码][代码]// 是否有下一页[代码][代码]    [代码][代码]let hasMore[代码][代码]    [代码][代码]if[代码] [代码](pageNum >= totalPage) {[代码][代码]      [代码][代码]hasMore = [代码][代码]false[代码][代码]    [代码][代码]} [代码][代码]else[代码] [代码]{[代码][代码]      [代码][代码]hasMore = [代码][代码]true[代码][代码]    [代码][代码]}[代码][代码]    [代码][代码]// 等待所有，orderBy()通过创建时间排序，查询单页数据[代码][代码]    [代码][代码]return[代码] [代码]db.collection(dbName).orderBy([代码][代码]'time'[代码][代码], [代码][代码]'desc'[代码][代码]).where(filter).skip((pageNum - 1) * pageSize).limit(pageSize).get().then(res => {[代码][代码]      [代码][代码]// 返回结果中顺带注入hasMore和total方便小程序端判断[代码][代码]      [代码][代码]res.hasMore = hasMore[代码][代码]      [代码][代码]res.total = total[代码][代码]      [代码][代码]return[代码] [代码]res[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] [代码]  [代码] [代码]   getList () {[代码] [代码]    [代码][代码]// 记录this指向[代码][代码]    [代码][代码]const that = [代码][代码]this[代码][代码]    [代码][代码]// 每次调用getList时重新从第一页开始[代码][代码]    [代码][代码]that.pageNum = 1[代码][代码]    [代码][代码]// 每次调用getList时，先将authorityList置空[代码][代码]    [代码][代码]that.authorityList = [][代码][代码]    [代码][代码]wx.cloud.callFunction({[代码][代码]      [代码][代码]// 云函数名[代码][代码]      [代码][代码]name: [代码][代码]'authorityList'[代码][代码],[代码][代码]      [代码][代码]// 传入云函数的参数[代码][代码]      [代码][代码]data: {[代码][代码]        [代码][代码]// 查询的默认筛选条件，这里可以参考下面留言审核对应的两张图来看，左上角有个switch开关[代码][代码]        [代码][代码]// 当开关开启时，filter:{show:false}生效[代码][代码]        [代码][代码]filter: that.checkFlag ? {[代码][代码]          [代码][代码]show: [代码][代码]false[代码][代码]        [代码][代码]} : [代码][代码]null[代码][代码],[代码][代码]        [代码][代码]// 查询页数[代码][代码]        [代码][代码]pageNum: that.pageNum,[代码][代码]        [代码][代码]// 每页条数[代码][代码]        [代码][代码]pageSize: that.pageSize[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]}).then(res => {[代码][代码]      [代码][代码]// 配合下拉刷新使用，作用是停止刷新事件[代码][代码]      [代码][代码]wx.stopPullDownRefresh()[代码][代码]      [代码][代码]// 以下动作为赋值操作[代码][代码]      [代码][代码]const temp = res.result[代码][代码]      [代码][代码]that.total = temp.total[代码][代码]      [代码][代码]that.hasMore = temp.hasMore[代码][代码]      [代码][代码]that.authorityList = temp.data[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码]  上面代码对应实例如下：1.查询未通过审核的留言；2.查询全部的留言 [图片][图片] 增（添加数据）[代码] [代码] [代码]   // 前面讲解过的注释之后的代码将不重复说明[代码] [代码]  const cloud = require([代码][代码]'wx-server-sdk'[代码][代码])[代码][代码]  cloud.init()[代码][代码]  const db = cloud.database()[代码][代码]  exports.main = async (event, context) => {[代码][代码]    [代码][代码]const dbName = [代码][代码]'message'[代码][代码]    [代码][代码]// 添加数据[代码][代码]    [代码][代码]return[代码] [代码]db.collection(dbName).doc(event.id).add({[代码][代码]      [代码][代码]data: {[代码][代码]        [代码][代码]desc: event.desc,[代码][代码]        [代码][代码]type: event.type,[代码][代码]        [代码][代码]show: event.show,[代码][代码]        [代码][代码]time: event.time,[代码][代码]        [代码][代码]url: event.url,[代码][代码]        [代码][代码]name: event.name[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] [代码][代码][代码]  [代码] [代码]   sendMessage () {[代码] [代码]    [代码][代码]const that = [代码][代码]this[代码][代码]    [代码][代码]if[代码] [代码](that.desc) {[代码][代码]      [代码][代码]wx.cloud.callFunction({[代码][代码]        [代码][代码]// 云函数名[代码][代码]        [代码][代码]name: [代码][代码]'addMessage'[代码][代码],[代码][代码]        [代码][代码]data: {[代码][代码]          [代码][代码]desc: that.desc,[代码][代码]          [代码][代码]type: [代码][代码]'message'[代码][代码],[代码][代码]          [代码][代码]show: [代码][代码]false[代码][代码],[代码][代码]          [代码][代码]time: utils.getNowFormatDate(),[代码][代码]          [代码][代码]url: that.userInfo.avatarUrl,[代码][代码]          [代码][代码]name: that.userInfo.nickName[代码][代码]        [代码][代码]}[代码][代码]      [代码][代码]}).then(res => {[代码][代码]        [代码][代码]// 关闭所有页面，打开到应用内的某个页面，跳转到留言列表页[代码][代码]        [代码][代码]wx.reLaunch({[代码][代码]          [代码][代码]url: [代码][代码]'/pages/message/main'[代码][代码]        [代码][代码]})[代码][代码]      [代码][代码]})[代码][代码]    [代码][代码]} [代码][代码]else[代码] [代码]{[代码][代码]      [代码][代码]tools.showToast([代码][代码]'说点什么吧~'[代码][代码])[代码][代码]    [代码][代码]}[代码][代码]  }[代码] [代码] [代码] [代码][代码]  对应实例如下： [图片][图片] 改（修改数据）[代码] [代码] [代码]   const cloud = require([代码][代码]'wx-server-sdk'[代码][代码])[代码] [代码]  cloud.init()[代码][代码]  const db = cloud.database()[代码][代码]  exports.main = async (event, context) => {[代码][代码]    [代码][代码]const dbName = [代码][代码]'message'[代码][代码]    [代码][代码]return[代码] [代码]db.collection(dbName).doc(event.id).update({[代码][代码]      [代码][代码]data: {[代码][代码]        [代码][代码]show: event.show[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] [代码]  [代码] [代码]   switchMessage (e) {[代码] [代码]    [代码][代码]const that = [代码][代码]this[代码][代码]    [代码][代码]wx.cloud.callFunction({[代码][代码]      [代码][代码]name: [代码][代码]'switchMessage'[代码][代码],[代码][代码]      [代码][代码]data: {[代码][代码]        [代码][代码]id: e.mp.target.dataset.id,[代码][代码]        [代码][代码]show: e.mp.detail.value[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]}).then(res => {[代码][代码]      [代码][代码]if[代码] [代码](res.result.errMsg === [代码][代码]'document.update:ok'[代码][代码]) {[代码][代码]        [代码][代码]that.getList()[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码]  对应实例如下：（前面没使用云函数也实现了相同的功能，感兴趣的可以对比查阅） [图片] 删（删除数据）[代码] [代码] [代码]   const cloud = require([代码][代码]'wx-server-sdk'[代码][代码])[代码] [代码]  cloud.init()[代码][代码]  const db = cloud.database()[代码][代码]  exports.main = async (event, context) => {[代码][代码]    [代码][代码]const dbName = [代码][代码]'message'[代码][代码]    [代码][代码]return[代码] [代码]db.collection(dbName).doc(event.id).remove()[代码][代码]  }[代码] [代码] [代码] [代码]  [代码] [代码]   deleteItem (id) {[代码] [代码]    [代码][代码]// 记录this指向[代码][代码]    [代码][代码]const that = [代码][代码]this[代码][代码]    [代码][代码]// 这里之所以使用wx.showModal是防止误操作[代码][代码]    [代码][代码]wx.showModal({[代码][代码]      [代码][代码]title: [代码][代码]'提示'[代码][代码],[代码][代码]      [代码][代码]content: [代码][代码]'你确定要删除这条留言？'[代码][代码],[代码][代码]      [代码][代码]success (res) {[代码][代码]        [代码][代码]if[代码] [代码](res.confirm) {[代码][代码]          [代码][代码]wx.cloud.callFunction({[代码][代码]            [代码][代码]name: [代码][代码]'deleteMessage'[代码][代码],[代码][代码]            [代码][代码]data: {[代码][代码]              [代码][代码]id[代码][代码]            [代码][代码]}[代码][代码]          [代码][代码]}).then(res => {[代码][代码]            [代码][代码]if[代码] [代码](res.result.errMsg === [代码][代码]'document.remove:ok'[代码][代码]) {[代码][代码]              [代码][代码]that.getList()[代码][代码]            [代码][代码]}[代码][代码]          [代码][代码]})[代码][代码]        [代码][代码]}[代码][代码]      [代码][代码]}[代码][代码]    [代码][代码]})[代码][代码]  }[代码] [代码] [代码] 对应实例如下： [图片] 总结掌握上面两种对应的增删改查后，相信大家对云开发会有一个更清晰的认识，也希望大家多多使用云开发做出更多好玩的小程序作品； 如果觉得看完这篇文章让你有想尝试使用云开发的冲动，请不要吝啬你的赞，有什么问题欢迎留言，一起交流学习。 对应小程序 欢迎大家体验： [图片] 日记小程序  [图片] 小程序订制加本人微信：huangbin910419 可按给定UI图订制