从头到尾撸个疫情期间针对学生信息报备的小程序（微信小程序+云开发实践）

前言

---

初学小程序，每天起床第一件事不是去看文档，而是打开班群接龙打卡信息，填写ex表（苦逼的大二狗每天群通知99+），所以萌生了写一款让学生报备信息的小程序。本来只是简单写了一个上报表单的程序，但是写完了之后又觉得好像缺了点什么，所以功能越写越多，项目不断重构，里面很多东西都是现学现用，陆陆续续写了10天左右，算是一滴都不剩了。。不对，是差不多写得没想法了，项目包含了一整套前后端的交互，由于很多数据前期和后期设计理念不一样，所以会有很多不完善的地方，希望大家轻喷。废话不多说，现在主要讲一下该项目的设计思路和一些功能的实现思路。
技术栈

• 微信小程序
• 云开发
• vant
• colorui
• echarts微信小程序版本

功能设计

---

首页

首页长这样，由一个谣言的轮播（数据来源丁香园）和一个本校学生寒假分布地图等等组成，学生上报数据之后地图相应的省份的人数便会更新。
地图的数据存在云数据库中，单独由一份表来维护，每个省份都是一个记录。

{
  "_id": "上海",  
  "name": "上海", //省名
  "value": 87.0  //该省份存在本校学生的人数
}

地图的数据从云函数getArea获取后返回到前台页面，进行地图的初始化，具体的例子可以参考微信小程序版echarts的map，也可以直接看我的源码，这里说一下里面的一些坑，由于绘画地图要引入中国地图的json数据（目录下的mapData），而小程序版本的echarts的例子中只有河南地图的json数据，因此需要去https://github.com/apache/incubator-echarts/tree/master/map/json这里来复制中国地图的json代码，粘贴至目录下的mapData中的json段落，才可以绘制中国的地图（其余地图也同理）。当初简直被坑得不