使用微信开发者工具可以创建云数据库，并通过代码可以查询并在客户端显示数据库的内容。
附：小程序一个功能页面有wxml(客户端呈现)，js(功能函数)，json，wxss(个性化处理)，这些是局部的文件。还有全局的文件如app.js和project.config.json。以上这些文件都需要用到。
一、创建云数据库
1. 在微信开发者的左上角点击“云开发”，如图1。
图1
2. 在弹出的界面中选择“数据库”，如图2。
图2
3.点击“+”后会按照箭头顺序出现集合名(自己命名,如ccwl.)和记录ID(系统命名)，如图3。
图3
4.在创建好数据库后，点击右上角的“设置”，如图4。
图4
5. 在弹出的窗口中，要记住环境ID(如“exchange-nigx4”)和刚才自己命名的集合名，如图5。
图5
二、客户端显示(wxml文件)
代码和注释：
<view><button bindtap="getData" type='primary'>查询数据</button></view> //建立名为getData的bingtap按钮，用以查询和返回数据。
<view><view wx:for="{{ne}}"> //将存储数据库返回值的ne输出<view>{{item.name}}</view> //item.name表示姓名<view>{{item.age}}</view> //item.age表示年龄//可以根据自己的喜欢在数据库中加入自己喜欢的类别。</view>
</view>
//这里的view插件并没有个性化，可以使用class和wxss文件进行个性化。
三、后台控制(页面的js文件、app.js和project.config.json)
3.1 页面的js文件的代码和注释：
const DB = wx.cloud.database().collection("ccwl") //声明调用的数据库名称，将刚在自己命名的数据库名写入(如ccwl)
Page({//添加数据，开发者完成addData() {DB.add({data: {name: "chenchao", //数据库的内容age: 25,ne: []},success(res) {console.log("添加成功", res) //调试界面可以看到是否添加成功},fail(res) {console.log("添加失败", res)}})},//查询数据，用户使用getData() {DB.get({success: res => {console.log(res.data)this.setData({ //收集数据到ne中并返回ne: res.data})},fail(res) {console.log("查询失败", res)}})}
})3.2 app.js的代码和注释：
App({onLaunch: function () {//云开发环境初始化wx.cloud.init({env: "exchange-nigx4" //初始化云服务，并将刚才的环境ID写入，如“exchange-nigx4”})}
})
3.3 project.config.json的代码和注释：
{"description": "项目配置文件", //开发工具原有代码"cloudfunctionRoot": "cloud/", //添加的代码，作用是调用云服务。***还有其它的代码******由于篇幅原因******不予以展示***}
四、效果展示
在3.1 页面的js文件中，我们将“chenchao”和“25”写入，在点击“查询数据”后会显示。注意: 这里我加入了自己的个性化(背景色),可以在wxss文件中修改。
五、视频演示
B站视频链接：
https://www.bilibili.com/video/BV1ti4y1t7Qh/
六、往期内容
七、参考文献
[1] 微信官方文档 《上手云数据库》
[2] weixin_30622181《微信小程序-获取云数据库某集合数据并显示在页面》 来源：CSDN
[3] 编程小石头 《3小时零基础入门微信小程序云开发，摆脱后台自己实现小程序后台服务器》 来源：哔哩哔哩
