『云数据库』新增数据
原创
1.前言
上篇文章，带着大家，用微信小程序开发工具提供的图形化界面来使用了一下云数据库和云存储，那么本篇主要是介绍一下我们来用代码操作云数据库的新增操作。
2.创建项目
2.1.目录结构
首先观察本次创建项目的目录结构，与之前的项目目录结构有所不同，以前的项目中只有一个文件夹，现在的项目中有两个文件夹，一个是 miniprogram 文件夹，一个是 cloudfunctions 文件夹，其中 miniprogram 文件夹是用来存放小程序的前端代码的，cloudfunctions 文件夹是用来存放小程序的后端代码的。
当然了，这两个文件夹名称都是可以更改的，如果要更改的话，首先要找到项目目录结构中的 project.config.json 文件，然后在这个文件中找到 cloudfunctionRoot 和 miniprogramRoot 这两个属性，然后将这两个属性的值更改为你想要的文件夹名称即可。
也就是告诉微信小程序你的云函数代码在哪个文件夹，你的小程序代码在哪个文件夹，这个是与原生开发不同的地方。
知道了这些之后，我们就可以开始来写代码了。写代码之前首先将一些我不认识的文件夹与文件先删除一下你们照着我的来即可。
删除 components 下的 cloudTipModal：
删除 pages 下的所有内容：
3.搭建演示页面
在 pages 下分别创建 cloud-fn、cloud-db、cloud-storage 三个文件夹，代表的含义就是云函数、云数据库、云存储，然后在这三个文件夹下分别创建 index 页面：
页面创建好了，需要展示一下所有要更改一下 app.json 文件，添加 tabBar 配置：
"tabBar": {
"list": [
{
"pagePath": "pages/cloud-db/index",
"text": "云数据库"
},
{
"pagePath": "pages/cloud-fn/index",
"text": "云函数"
},
{
"pagePath": "pages/cloud-storage/index",
"text": "云存储"
}
]
}除了添加 tabBar 配置之外，还需要将 pages 下的 index 页面的配置删除, 包括那些之前自动创建的页面配置：
"pages": [
"pages/cloud-db/index",
"pages/cloud-fn/index",
"pages/cloud-storage/index"
],
这样我们的页面就创建好了，接下来就是来写代码了。
4.云数据库
首先来看云数据库也就是云存储, 更改 cloud-db/index.wxml 文件，分别添加 CRUD 的按钮，CRUD 单词分别是 Create、Read、Update、Delete 的首字母缩写，也就是新增、查询、修改、删除的意思：
<button type="primary" bindtap="onAddTap">新增</button>
<button type="primary" bindtap="onRemoveTap">删除</button>
<button type="primary" bindtap="onUpdateTap">修改</button>
<button type="primary" bindtap="onQueryTap">查询</button>然后在 cloud-db/index.js 文件中添加对应的事件处理函数：
Page({
onAddTap() {
},
onQueryTap() {
},
onRemoveTap() {
},
onUpdateTap() {
}
})好页面按钮与事件处理函数都添加好了，接下来就要介绍一下如何来操作云数据库了。
注意点：在操作云数据库之前，一定要先初始化
4.1.初始化
找到 miniprogram/app.js 文件，然后在这个文件中添加初始化代码, 你打开这个文件当中有一行 wx.cloud.init 的代码，这行代码就是用来初始化的，我们只需要在这行代码的基础上添加一些配置即可。
有注释介绍到 env 参数决定接下来小程序发起的云开发调用（wx.cloud.xxx）会默认请求到哪个云环境的资源，也就是说我们需要在这里配置一下我们的云环境，那么我们的云环境在哪里呢？我们的云环境在云开发控制台中，我们打开云开发控制台，然后在这里找到环境:
在云开发控制台中，有一个当前环境，这个当前环境我们是可以创建多个的，这个当前环境就是指定我们本次要使用的云环境，然后在控制台管理界面中可以看到我们的云环境的环境 ID，我们将这个环境 ID 复制下来，然后回到我们的小程序代码中，将这个环境 ID 配置到我们的初始化代码中即可。
好 env 介绍完毕，在来看一下 traceUser 参数：
- traceUser: 是否要追踪用户的行为。设置为 true，用户可在管理端看到用户访问记录。默认为 false。
这个当前环境就是相当于一台服务器，你就理解为每个环境都相当于一台服务器，我将我创建的云环境 ID 放入到了代码中就是告诉微信小程序我目前用的那台服务器，这样我们就可以使用云数据库了。
4.2.新增
接下来就是来介绍一下如何来新增数据了，如果想要通过代码来新增数据，分为如下几步：
- 1.拿到当前环境对应的数据库
- 2.拿到当前数据库中指定的集合（也就是本次要操作的集合）
// 1.拿到当前环境对应的数据库
const db = wx.cloud.database();
// 2.拿到当前数据库中指定的集合（也就是本次要操作的集合）
const stuCollection = db.collection('stu');通过如上两步，我们就可以拿到我们要操作的集合了，然后就可以来进行数据的新增了，新增数据的方法是 add，这个方法是一个异步方法，所以我们需要使用 async 和 await 来进行异步操作：
async onAddTap() {
const res = await stuCollection.add({
data: {
name: '翠花',
age: 18,
}
})
console.log(res);
},代码写完了，测试一下，点击新增按钮，然后在控制台中可以看到新增成功的数据：
好了，云数据库的新增操作就介绍到这里就结束了，通过本文大家可以了解到如何通过代码来操作云数据库的新增操作。
本篇文章内容介绍到这就结束了，我们下期再见，感谢大家的观看，谢谢大家。
?如果您对本文有任何疑问或想法，请在评论区留言，我将很乐意与您交流。 ?您的每一条评论对我都至关重要，我会尽快给予回复。 ?如果您觉得这篇文章对您有所启发或帮助，请不吝赞赏、收藏或分享。 ?您的每一个动作都是对我创作的最大鼓励和支持。 ?谢谢您的阅读和陪伴！ ?感谢您的支持，我会继续努力的！
我正在参与2024腾讯技术创作特训营第五期有奖征文，快来和我瓜分大奖！
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。