共计 2729 个字符，预计需要花费 7 分钟才能阅读完成。
人设千万种，“高危”的大概有两种：好老公 / 老婆 & 学霸。
猪年第一瓜，演艺事业一帆风顺的翟 XX，栽在了学霸的人设上，这件事深刻地教育了我们：
1、学习这件事情来不得一点虚假
2、学无止境，空杯心态
So，忘掉翟 XX 吧！让我们好好学习，跟着 #技本功#，学点真材实料的东西~
-2019 年第 7 期 -
前 言
1、云开发是什么？
云开发是小程序为开发者提供的完整的云端支持。
2、云开发能做什么？
开发者可以使用云开发进行数据持久化（数据库），保存文件（存储）以及带有天然鉴权特性的云函数。
3、怎么使用云开发？
当然是先看微信的官方文档啦！查看地址：
https://dwz.cn/ioeWuJ9a
云开发共提供了三种能力，分别是：
云函数：在云端运行的代码，微信私有协议天然鉴权，小程序随时调用。
数据库：云端 JSON 数据库，小程序前端和云函数都可以进行操作。
存储：在小程序前端直接上传 / 下载文件。
要开始使用云开发，需要先开通云开发环境，每个小程序账号可以免费创建两个环境，目前小程序（2018.11.09）还没有提供删除环境的功能，所以建议先创建一个 dev 环境进行日常的开发和测试。
云开发环境目前是免费使用，且只有一种套餐，其中数据库配额如下：
容量：2GB
QPS：30
同时连接数：20
读操作次数：5 万 / 天
写操作次数：3 万 / 天
集合限制：100 个
单集合索引限制：10 个
以上的配额满足了一般个人开发者使用并且目前是免费的，如果资源不够的可以联系微信团队进行上调。
具体看这里：https://dwz.cn/vWxrz5Vr
本文使用云开发的数据库特性来写一个“吃什么”，该小程序具有下面几个功能点：
1、添加页面：增加新菜名
2、查看所有数据页面：查看菜单并可以删除菜品类目
3、首页：随机抽出一条数据
本文分为两部分：
第 1 部分主要带大家了解云开发的基本步骤和配置，从环境搭建到完成简单的菜品增加页面；
第 2 部分带大家了解云开发详细使用和不足，从首页到删除页面。
下面我们开始“吃什么”小程序的前期准备工作。
Step1：创建云开发环境
1、在微信开发者工具中点击云开发按钮打开云开发控制台，新建环境（目前一个账号仅能创建两个环境，环境之间相互隔离且目前不能删除 2018.10.23，建议先创建一个 dev 测试环境）。
开发控制台在开发者工具中的入口
2、点击数据库创建一个集合 collection，（可把集合看成 ’ 表 ’）。
开发控制台 - 数据库 tab
有了这两个，我们就可以进行基本的数据库操作了。
为了让每个用户都可以看到彼此录入的菜名，我们这里设置集合的权限为所有人都可读。
Step2：搭建文件结构
在根文件夹下面新建文件夹 images、pages、style、unilt 四个文件夹。完整的结构如下图：
结构图
其中 app.js 是微信生成的一个初始化 js 文件，app.json 用于配置小程序路由等信息，app.wxss 为全局 css 文件。project.config.json 用于配置项目信息，包括根目录、云函数目录、项目设置以及项目名称和 appid 等基础信息。
我们页面代码写在 pages 文件下，目前有新增 add 与首页 index 两个页面，每个页面包含 wxml、wxss 和一个 js 文件。wxml 写页面结构，wxss 写样式，js 作为控制。
Step3：初始化数据库连接
为了方便所有页面引用数据库对象且目前本小程序不需要操作额外的集合，所以在 app.js 里我们在程序加载的时候初始化好数据库连接。微信官方提供的示例是使用 wx.cloud 对象的 init 方法，接受一个 json 对象，json 里填入我们环境 id 即可完成初始化。
env 字段填写自己云开发环境的环境 id，在云开发控制台 - 概览可以找到。
traceUser 选项表明是否追踪用户，开启的时候我们可以在控制台查看访问数据库的用户信息。
初始化完成后我们连接到我们的数据库，并创建一个全局的 TB 对象指向对 food 集合的引用。
然后将数据库引用和集合引用赋给全局数据的 DB 和 TB。
这样一来我们就可以在所有 js 里使用数据库连接了，下面我们进行 ajax 的编写。
Step4：编写 ajax 方法
为了方便所有页面使用，我们将基本的增删查功能单独为一个文件，这样在页面的 js 里直接引用就可以了。
通用的 ajax 方法就是常见的增删改查。说是 ajax，其实只是调用微信的云开发接口，不需要我们手动编写 ajax 请求。常用的云开发数据库 api 有获取 get、查询 where、删除 remove、获取数量 count、更新 update 以及分页时使用的 skip 和 limit 函数。
我们在 unitl 文件夹下面新建一个 ajax.js 文件。
我们根据目前情况先编写一个获取所有菜单的方法和一个添加新菜名的方法。
目前微信云开发的数据库 get 方法只能每次最多 20 条数据。如果我们想获取集合中的所有数据，就要联合使用 count、skip 和 limit 函数进行递归获取。
count 函数：返回指定条件下（where）的内容数量。
skip 函数：接受一个 int 类型的参数 n，代表第 n 个结果后开始返回。
limit 函数：接受一个 int 类型参数 m，代表每次获取 m 个 item。
首先我们创建一个根据条件、页码和每页大小获取数据的方法：
这里我们使用了全局变量 TB，使用 skip、limit 和 get 方法实现分页获取数据。
我们这里创建一个 flag_pop 的函数用于递归，通过 page 变量决定是否递归，page 是通过 count 函数和 size 进行计算而来的页数，向前进一确保数据不会遗漏。
下面我们来写增加新数据方法，增加数据使用 add 方法即可，add 方法接受一个对象数据，里面有 data（要保存的数据）、success（成功后的执行函数）、error（失败后的执行函数）。
代码如下：
Step5：编写增加页面
在 add 文件夹下面增加相应文件:
下面编写增加页面，目前写一个输入框和一个保存按钮即可。
输入框绑定 handleInput 方法获取输入，保存调用 handleSave 方法即可。完成后页面是这样的：
下面我们编写 add.js 文件，包含一个输入变量、handleInput 函数和 handleSave 函数。我们在 handleSave 函数中直接调用 ajax.js 中的 addFood 函数进行数据保存：
下面我们编写 add.wxss 文件进行页面美化，请自己斟酌，笔者美化后增加页面长这样的：
下面我们进行测试，随意输入一下点击保存。提示保存成功后查看云开发控制台验证是否保存成功。
总 结
添加页面编写好了以后我们就完成了这个小程序的前期工作了。云开发使用起来非常方便，添加一条记录使用 add 方法即可，可以看到云开发的 api 设计的非常易于使用，我们将在第二部分使用其他的的云开发 api 进行首页和删除功能的编写。
