sup-003 微信小程序开发快速入门

Posted at 2019-03-09 reference 

微信小程序开发快速入门（持续更新）

​ 本教程基于微信开发者工具所提供的指南归纳提炼重点而成，教程编写日期为2019年3月9日，如果有后续更新导致的版本差异，一切以官方文档为主

微信小程序基本框架

1. 微信小程序的开发逻辑与网页开发逻辑一致，分为前端（客户端）与后端（服务器端）两部分，为了弱化后端概念，微信提供云开发组件，云开发功能提供数据库管理、云函数使用的功能，简单来说就是实现对用户数据的存储与处理，具体介绍参考后面的云开发指南章节

2. 微信小程序的前端逻辑：

   graph TB
   a1[前端]-->a2{逻辑层}
   a1-->a3{视图层}
   
   a2---sub1[JavaScript]
   a2---sub4[json]
   a3---sub2[wxml]
   a3---sub3[wxss]
   
   

3. 前端文件间的关联：（设页面名为page）

   graph TD
   a[app.js]--"定义app()用以页面JS调用"-->a2[page.js]
   b[app.json]--"决定小程序的整体布局，部分细节可由页面json文件微调"-->b2[page.json]
   subgraph pages
   	wxml[page.wxml]--"调用JS定义的数据与方法"---a2
   	wxss[page.wxss]--"决定样式"---wxml
   	wxs[page.wxs或<wxs>]--"前端的简易脚本"-->wxml
   	end
   

4. WXS与js区别与具体应用场景：
   wxs是为视图层服务的脚本，主要用于诸如在前端进行简单运算或者调用一些基础类库的功能，不能响应事件。
   js虽然会负责提供初始数据，更多的功能是处理事件，诸如页面打开、挂起、关闭、分享、用户下拉刷新、组件的调用等，起到调用API具体处理问题、与后端交互的功能。

5. 页面生命周期：
   onLoad->(onShow->onHide)可能存在多个->onUnload。具体生命周期涉及逻辑层与视图层多次互动，详细内容参见官方文档

6. 页面设计指南

云开发指南

1. 数据库：可对不同数据类型进行权限控制，限定用户只能修改自己的数据，但可以读取他人数据。读取隐私数据操作需使用云函数来保证安全性，普通操作可在用户端实现。数据库的查找、访问均由API实现。
2. 存储：可将云端内容存储到用户本地，诸如用来更新历史记录等操作，可在用户端与管理端实现操作，对文件的操作均基于上传后得到的文件ID，并且文件可设置权限。
3. 云函数：运行环境为node.js ，使用云函数时可以无视多数权限以操作数据库与存储。