微信小程序快速入门分享大纲

微信小程序

• 整体流程
• 开发细节

---

 

一、整体流程

1、注册小程序账号

邮箱注册

不能使用同时注册了微信其他用途的邮箱

去邮箱激活账号后，需要填写个人实名信息

若是第一次成为管理员，需要先补充个人实名信息

注册完成

2、填写小程序基本信息

1） 基本信息
2） 成员管理
3） 配置服务器域名 必须https

3、开发者工具

使用AppID创建一个新项目

如何真机调试

4、开发完成后，上传代码

提交审核

微信收到通知，查看审核结果

审核通过后，发布上线

 

二、开发细节

1、项目代码结构

四部分：JSON WXML WXSS JS
基本流程：先根据 json 配置生成一个界面，顶部的颜色和文字你都可以在这个 json 文件里边定义好。紧接着会装载这个页面的 WXML 结构和 WXSS 样式。最后会装载 js。

公共
在app.json中，写在 pages 的第一个页面就是这个小程序的首页（打开小程序看到的第一个页面）；
小程序启动之后，在 app.js 定义的 App 实例的 onLaunch 回调会被执行；
整个小程序只有一个 App 实例，是全部页面共享的 如globalData 。

局部
在各页面的js 中，Page 是一个页面构造器，这个构造器就生成了一个页面；
渲染完界面之后，页面实例的 onLoad 回调会被执行。

2、JSON

app.json
project.config.json
page.json

3、WXML

类似HTML
不同：
标签不同
指令语法不同 （注意与VUE的区别，特别是表达式） wx:if wx:else wx:for 指令里的变量需要加双括号

模板（data 是要模板渲染的数据，data="{{...item}}" 写法是ES6的写法，item是wx:for当前项，... 是展开运算符，在模板中不需要再{{item.courseName}} 而是直接{{courseName}}）

4、WXSS

WXSS 仅支持部分 CSS 选择器
如何支持LESS

5、JS

常用API（比如请求、缓存等）

6、云开发

什么是云开发
怎么用

首先，开通云开发服务。

创建云开发项目demo看一下

云开发控制台的基本使用

demo在小程序代码操作数据库之前，必须要先对login文件夹执行“上传并部署”（云函数的基本用法）