最近在重构公司的小程序，所以暂时没有更新。在上一篇介绍了整体功能的搭建与uniCloud服务空间的创建，本篇文章将记录数据库的设计与文章列表功能的实现。
数据库设计
在前面讲到的uniCloud创建完服务空间后，接下来将实现如何去创建、上传云函数，先来说说数据库的设计，在本次开发中暂时要用到以下几张数据表：
- users(用户表，用于存放用户昵称头像)
字段 | 描述 |
nickName | 用户名 |
avatarUrl | 用户头像 |
articles(文章表)
字段 | 描述 |
author_name | 作者、发布人 |
cover | 文章头图 |
desc | 文章简述 |
publish_time | 发布时间 |
title | 文章标题 |
type | 文章类型 |
order | 排序 |
visit_num | 访问人数 |
topping | 是否置顶 |
article_content(文章详情表)
字段 | 描述 |
article_id | 文章id(关联articles表) |
content | 文章内容 |
comment(评论表)
字段 | 描述 |
article_id | 文章id(关联articles表) |
content | 评论内容 |
publish_time | 评论时间 |
nickName | 用户名(关联user表) |
avatarUrl | 用户头像(关联user表) |
readed | 审核并显示 |
replyer | 回复者(预留) |
collection(收藏表)
字段 | 描述 |
userid | 用户id(关联user表) |
articleid | 文章id(关联articles表) |
like(点赞表)
字段 | 描述 |
userid | 用户id(关联user表) |
articleid | 文章id(关联articles表) |
sign(签到表)
字段 | 描述 |
userid | 用户id(关联user表) |
index_banner(首页banner表)
字段 | 描述 |
userid | 用户id(关联user表) |
初始化数据库
在理清大概的表之后，来到项目右键cloudfunctions-aliyun先创建db_init.json文件，该文件可按配置规则创建表和添加数据，在这里本地数据可以直接同步到云数据库中。
以下是官方db_init.json的形式：
{ "collection_test": { // 集合(表名) "data": [ // 数据 { "_id": "da51bd8c5e37ac14099ea43a2505a1a5", "name": "tom" } ], "index": [{ // 索引 "IndexName": "index_a", // 索引名称 "MgoKeySchema": { // 索引规则 "MgoIndexKeys": [{ "Name": "index", // 索引字段 "Direction": "1" // 索引方向，1：ASC-升序，-1：DESC-降序，2dsphere：地理位置 }], "MgoIsUnique": false // 索引是否唯一 } }] }}当然，你也可以登录uniCloud的控制器后台对数据和集合进行可视化操作。
文章列表页
首页的结构设计分为头图banner、文章列表，至于样式排版各自可以发挥，也不一定要按照我的。在cloudfunctions-aliyun下创建好articles的云函数之后，接下来就来写一下云函数的代码，也是相对比较简单的增删改查，如下：
'use strict';// 获取数据库的引用const db = uniCloud.database()// 获取集合的引用(数据表)const articleCollection = db.collection('article')exports.main = async (event, context) => { // 获取从前端传过来的参数 let article_id = event.id switch (event.type){ // 查询文章列表(分页) case 'list': let { page, limit } = event // 每页的条数 let skip = (page - 1) * limit return await articleCollection.skip(skip).limit(limit).orderBy("order", "asc").get() break }};在写好云函数上传部署后，就可以来到前端页面index.vue进行调用，如下：
export default { data() { return { articleList: [], page: 1, status: '加载中' } }, onLoad() { this.getListData() }, methods: { // 获取文章列表 getListData(){ let page = this.page uniCloud.callFunction({ // 调用云函数为articles name: "articles", // 传入到云函数的参数 data: { page, // 查询页数 limit: 8, // 查询条数 type: 'list' // 查询类型 } }).then(res => { console.log('获取文章列表 ===== ',res.result.data); let list = res.result.data this.articleList = page === 1 ? list : this.articleList.concat(list) // 这里用于后面的上拉加载功能 this.status = list.length < 8 ? '没有更多了' : '上拉加载更多' }).catch(err => { console.log(err); }) } }以上都写好后就可以来到微信开发者工具预览一下所调用的结果，
再看一下uniCloud的控制台，数据的调用是跟云数据库里的是一样的。
最后
写文章会在工作之余的时间去完成，在数据库的设计上如果有何不妥或者你有更好的设计开发方式的话还请各位大佬指点一二，也希望各位多多支持，看完之后点个在看点个赞和转发。接下来我的工具类个人小程序即将发布，敬请期待。
