目录
一、常用知识点
二、开发坑
三、扩展
一、常用知识点
1、浏览器、服务器、小程序之间模块组成
（1）浏览器
ES、DOM、BOM
（2）服务器
ES、native、npm
（3）小程序
ES、小程序框架、专用api
2、小程序运行环境
（1）开发环境
IDE——nwjs
（2）生产环境
android——X5内核
ios——JSC内核
PS：平台不同，环境不同，兼容性也会有差异。因此，尽量多做真机测试。
3、基本构成
（1）结构
WXML
（2）样式
WXSS
（3）数据逻辑
WXS、JS
4、<wxs>标签——将外部 / 内部wxs代码，打包成一个组件对象
用法
在标签内加入module="xxx"，xxx为组件对象，而代码块暴露出来的变量，将作为该对象的属性或方法。
除了module.exports外，不要用其他ES6语法
5、在wxs代码块中，/*为结束注释，后面的代码不会执行
6、小程序框架——MINA框架
特点
（1）双线程
（2）WXML、WXSS、WXS都在ui线程中运行
（3）逻辑层通过page.setData(obj)方法，向视图层传递需要更新的数据
7、启动方式
（1）冷启动
第一次启动、5分钟后再启动、两次警告后再启动（被微信销毁了）
（2）热启动
5分钟内启动
若启动时，小程序有新版本，会异步加载内容，默认下次启动时替换为新版本，但是可以使用某api功能，达到立即替换为新版本。
8、资源加载流程
特点
（1）本地缓存
（2）CDN内容分发网络
（3）ajax
9、生命周期事件——程序生命周期、页面生命周期
程序生命周期
（1）onLaunch：初始化完成
（2）onHide：收起小程序到后台
（3）onShow：展开小程序到前台（热启动）
（4）onError：程序出错
globalData——全局数据
页面生命周期
（1）onLoad：页面冷启动后，初次加载（只有一次）
（2）onShow：每次切换页面，在之后的页面中触发
（3）onReady：页面被首次切换到（每个页面只有一次）
（4）onHide：每次切换页面，在之前的页面中触发
（5）onUnload：关闭当前页
data——页面数据
10、指令渲染写法（如wx: if或者wx: for）
（1）单个渲染
直接在标签内部写
（2）多个
用block包裹，在block写
11、wxml文件导入
（1）<import/>
只导入目标文件中的模板，而间接的模板不会导入
（2）<include/>
导入目标文件中，除了模板的全部内容，间接的模板也会导入
12、<text>支持转义字符
13、<rich-text>
通过html、css的方式，渲染出wxml、wxss的内容。
14、在app.json的pages数组中，写页面路径的同时，会在该位置自动生成相应系列文件。
15、存储数据
视图层
dataset，自定义属性
逻辑层
data对象
16、其他内容
（1）project.config.json
保存环境配置，防止换电脑跑不了项目。
（2）其他json
保存页面配置，而app.json负责整个小程序的配置（操盘手）。
（3）js
应用级JS、页面级JS，分别具有应用级、页面级的生命周期事件。
（4）utils文件夹
存放共用工具类，如常用的函数。
17、页面而言，除了基本的生命周期事件外，还具备丰富的交互事件，如上下拉、滚动、分享、tab切换
若不设置分享函数，则右上角按钮中，菜单会没有转发功能。而且，分享函数可以返回一个对象，为分享窗口提供自定义标题、描述，以及带参的转发路径。
18、页面路由
概念
以栈的形式，管理页面的历史记录。
注意点
（1）重定向：前一个页面出栈。
（2）tab切换、重新加载：之前所有页面出栈。
（3）进栈onLoad，出栈onUnload。
（4）栈存放页面数量，不能超过5个。
19、注意回调时，this指向会产生变化。
解决措施
（1）私有变量保存this。
（2）ES6语法。
20、逻辑层数据
（1）this.data.xxx
只关注逻辑层，数据不传递到视图层。
（2）this.setData(obj)
更改逻辑层的同时，会将数据传递到视图层，但是单次设置不要超过1M。
21、插值表达式（双花括号）
（1）{{ }}内部可以放入data中的变量，也可以是任何表达式
（2）安放位置
特性值、标签之间。
22、列表渲染时，没有设置key的话，会有警告。若是静态列表，无需强求，但强迫症例外。
23、模板管理
在pages文件夹下，新开一个template文件夹，存放不同类型的模板，便于管理。
24、标签组件
学习方法
多看文档，对各组件的特性有大致了解。
input组件不能设置字体类型。
25、页面带参跳转
（1）旧页面
在url中，拼接字符串。
（2）新页面
onLoad()会接收一个装载参数的对象。
26、性能优化
https://developers.weixin.qq.com/miniprogram/dev/framework/performance/tips.html
27、事件绑定
（1）冒泡流（子到父）
bind(xxx)——冒泡
catch(xxx)——不冒泡
（2）捕获流（父到子）
capture-bind:xxx——捕获，再冒泡
capture-catch:xxx——捕获到位后，停在该位置，不冒泡
28、自动预览
开发者工具中，具备自动预览功能，让手机与电脑实时通讯，不必每次调试都要扫码，不过一定要先保存，再进行编译预览。
29、真机调试
（1）与预览相比，真机调试提供详细的监控信息。
（2）某些设备不支持部分API，因此真机调试更可靠。
30、WXSS不能获取本地资源，如background
31、button标签实现转发
https://www.cnblogs.com/cisum/p/9467505.html
32、小程序实现双向绑定
https://www.cnblogs.com/sgqwjr/p/9130744.html
33、地图导航
https://www.cnblogs.com/silent007/p/8670091.html
（1）动态获取经纬度
http://www.cnblogs.com/silent007/p/9023799.html
（2）静态获取经纬度
https://lbs.qq.com/tool/getpoint/
二、开发坑
1、wx.getSystemInfo()要从onReady()阶段开始，才能正常运行。
2、canvas系列
（1）ctx.drawImage()图片路径必须是本地的，因此先要用wx.downloadFile()将图片下载到本地，再进行绘制。
（2）wx.canvasToTempFilePath()必须作为ctx.draw()的回调，才能正常导出画布截图路径；而且为了防止产出图片变形（还没完全生成），应该为该方法加上大于300ms的延迟。因此，基本格式为ctx.draw()——>wx.canvasToTempFilePath()——>setTimeout()。
（3）画布尺寸单位为px，想要响应式，必须先获取屏幕像素，通过rpx转换公式运算，获得单个rpx相应的值，此时插入因数就相当于使用rpx单位。
（4）隐藏画布的最佳方法：用绝对定位甩出屏幕。
1、外层零宽高overflow: hidden藏不住画布中的图片
2、手法必须是藏，不能是消，若不让画布渲染，则无法对画布截图
3、广告
（1）注意官方规定的广告安放位置规则
（2）广告元素不能绑定事件等骚操作
（3）上线后，广告需要审核，可能一段时间显示不了广告
三、扩展
1、获取当前页url
https://www.hishop.com.cn/xiaocx/show_52692.html
2、小程序跳转到其他小程序
https://blog.csdn.net/shaleilei/article/details/83785538
3、小程序注册登录，获取用户信息
（1）视频
https://www.bilibili.com/video/av38342501?from=search&seid=1562815510002242871
（2）博文
https://www.cnblogs.com/cisum/p/9458692.html
https://www.cnblogs.com/HappyYawen/p/9047420.html
