微信小程序云开发初学者入门教程二-前端操作数据库模块

1.如何操作数据库，作为一名前端，如果对数据的知识不够熟悉也没关系，从现在开始好好学习就行，数据库的操作内容差不多涉及增删改查四大模块，花一些业余的时间在上面，也必有所得。

2.数据库操作大多数需要用户openid,需要先配置好吧login云函数，如果已经配置好了，获取用户的openid之后，开始步骤：

3.步骤

1：打开云开发控制台，进入到数据库管理模块图片.png2：选择添加集合，集合名称为counters，添加完成之后的界面图片.png3：可以看到counters集合出现在左侧集合列表中

4.注：集合必须在云开发控制台中创建

4：新增一条记录试一试

5.a.打开pages/databaseGuide/databaseGuide.js文件，定位到onAdd方法

图片.png

6.b：选中所有注释过的代码，ctrl+/快捷键，解除注释

onAdd:function(){constdb=wx.cloud.database()db.collection('counters').add({data:{count:1},success:res={//在返回结果中会包含新创建的记录的_idthis.setData({counterId:res._id,count:1})wx.showToast({title:'新增记录成功',})console.log('[数据库][新增记录]成功，记录_id:',res._id)},fail:err={wx.showToast({icon:'none',title:'新增记录失败'})console.error('[数据库][新增记录]失败：',err)}})},

7.c.onAdd方法会往counters集合新增一个记录，新增如下格式的一个JSON记录

{"_id":"数据库自动生成记录ID字段","_openid":"数据库自动插入记录创建者的openid","count":1}

8.在桌面新建一个json文件，将这段代码复制黏贴进去，备用

图片.png

9.导入之后显示的界面

图片.png

10.d：点击按钮：新增记录

图片.png

11.e：在云开发-数据库-counters集合中可以看到新增的记录

图片.png微信小程序云开发数据库操作一添加记录实例演示

12.官方文档解读：

!--新增记录--viewclass="guide"wx:if="{{step===3}}"textclass="headline"新增记录/texttextclass="p"1.打开pages/databaseGuide/databaseGuide.js文件，定位到onAdd方法/texttextclass="p"2.把注释掉的代码解除注释/textimageclass="code-image"src="../../images/code-db-onAdd.png"mode="aspectFit"/imagetextclass="p"3.onAdd方法会往counters集合新增一个记录，新增如下格式的一个JSON记录/texttextclass="code"{"_id":"数据库自动生成记录ID字段","_openid":"数据库自动插入记录创建者的openid","count":1}/texttextclass="p"4.点击按钮/textbuttonsize="mini"type="default"bindtap="onAdd"新增记录/buttontextclass="p"wx:if="{{counterId}}"新增的记录_id为：{{counterId}}/texttextclass="p"5.在云开发-数据库-counters集合中可以看到新增的记录/textdivclass="nav"buttonclass="prev"size="mini"type="default"bindtap="prevStep"上一步/buttonbuttonclass="next"size="mini"type="default"bindtap="nextStep"wx:if="{{counterId}}"下一步/button/div/view做一个小demo

13.效果如下：点击新增记录的按钮的时候，会出现提示，新增的记录为多少，并且有弹框提示，新增记录成功。

U6QBH3PeXy.gif

14.打开云开发控制台，点击数据库模块，可以看到刚刚添加的记录

图片.png

15.wxml代码：

buttonsize="mini"type="default"bindtap="onAdd"新增记录/buttontextclass="p"wx:if="{{counterId}}"新增的记录_id为：{{counterId}}/text

16.js代码：

//pages/databaseGuide/databaseGuide.jsconstapp=getApp()Page({data:{step:1,counterId:'',openid:'',count:null,queryResult:'',},onLoad:function(options){if(app.globalData.openid){this.setData({openid:app.globalData.openid})}},onAdd:function(){constdb=wx.cloud.database()db.collection('counters').add({data:{count:1},success:res={//在返回结果中会包含新创建的记录的_idthis.setData({counterId:res._id,count:1})wx.showToast({title:'新增记录成功',})console.log('[数据库][新增记录]成功，记录_id:',res._id)},fail:err={wx.showToast({icon:'none',title:'新增记录失败'})console.error('[数据库][新增记录]失败：',err)}})},})

17.对于数据库的增删改查后续会有更加细致的文章：1：微信小程序云开发数据库操作一添加记录2：微信小程序云开发数据库操作二查询记录3：微信小程序云开发数据库操作三删除记录4：微信小程序云开发数据库操作四更新记录

18.下班之后带着电脑回家，在地铁上拥挤非常，感觉电脑都要被挤坏了，这几天反思了一下从前，每天上班下班，完成老板给的任务就可以潇洒走人了，总觉得自己不够努力，又或者每天重复着老旧的技术，周而复始，早已落后于前端发展的潮流，不觉开始惶恐。每天晚上开始学习，戒掉游戏和手机，让自己尽快达到一个沉迷于代码不可自拔的境界。

19.原文作者：祈澈姑娘技术博客：https://www.jianshu.com/u/05f416aefbe190后前端妹子，爱编程，爱运营，爱折腾。坚持总结工作中遇到的技术问题，坚持记录工作中所所思所见，欢迎大家加入群聊，一起探讨交流。