易忘点
1.模版引入----需要注意的是 import 有作用域的概念，即只会 import 目标文件中定义的 template，而不会 import 目标文件中 import 的 template，简言之就是 import 不具有递归的特性。
2 共同属性
1566458541966.jpg
3.样式权重---权重越高越优先。在优先级相同的情况下，后设置的样式优先级高于先设置的样式。
Unknown.png
4.程序构造器App()---生命周期函数都有对应的option对象参数。
宿主环境提供了 App() 构造器用来注册一个程序App，需要留意的是App() 构造器必须写在项目根目录的app.js里，App实例是单例对象，在其他JS脚本中可以使用宿主环境提供的 getApp() 来获取程序实例。
other.js
var appInstance = getApp()
通常接受一个对象作为参数
、、、App({
onLaunch: function(options) {},
onShow: function(options) {},
onHide: function() {},
onError: function(msg) {},
globalData: 'I am global data'
})、、、
定时器及时清除
所有页面的脚本逻辑都跑在同一个JsCore线程，页面使用setTimeout或者setInterval的定时器，然后跳转到其他页面时，这些定时器并没有被清除，需要开发者自己在页面离开的时候进行清理。
页面配置时----在app.json的pages字段的代码路径需要去除.后缀。
页面构造器Page(）---生命周期函数都有对应的option对象参数。
、、、Page({
data: { text: "This is page data." },
onLoad: function(options) { },
onReady: function() { },
onShow: function() { },
onHide: function() { },
onUnload: function() { },
onPullDownRefresh: function() { },
onReachBottom: function() { },
onShareAppMessage: function () { },
onPageScroll: function() { }
})、、、
数据绑定修改注意点
直接修改 Page实例的this.data 而不调用 this.setData 是无法改变页面的状态的，还会造成数据不一致。
由于setData是需要两个线程的一些通信消耗，为了提高性能，每次设置的数据不应超过1024kB。
不要把data中的任意一项的value设为undefined，否则可能会有引起一些不可预料的bug。
触摸反馈
、、、<button hover-class="hover"> 点击button </button>
<view hover-class="hover"> 点击view</view>
<button loading="{{loading}}" bindtap="tap">操作</button> 带loading的按钮，表示耗时操作，loading是变量，控制显示loading显示和隐藏。
、、、
网络请求
1.小程序宿主环境要求request发起的网络请求必须是https协议请求。
2.wx.request请求的域名需要在小程序管理平台进行配置。调试阶段，开发者工具、小程序的开发版和小程序的体验版在某些情况下，允许wx.request请求任意域名。
3.请求或者返回参数中，版本的兼容性问题，相邻版本中，字段新增新增而不是修改。
4.请求参数，尽量使用data参数来传递，避免拼接带来的长度限制等问题。
5.域名不要使用IP地址或者localhost，并且不能带端口号，同时域名需要经过ICP备案。
- SessionId---本应用服务器中传递的凭证ID。
本地存储隔离
1.小程序宿主环境会隔离不同小程序、不同微信宿主的数据缓存。
2.每个小程序的缓存空间上限为10MB。
3.一般在对数据实时性/一致性要求不高的页面采用本地数据缓存数据来做提前渲染，用以优化小程序体验。
事件通讯
1、事件分冒泡事件与非冒泡事件。
2、bind事件绑定不会阻止冒泡事件向上冒泡，catch事件绑定可以阻止冒泡事件向上冒泡
3、cavas中的触摸事件不可冒泡，所以没有 currentTarget。
[https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/event.html]
4、mark 和 dataset 很相似，主要区别在于： mark 会包含从触发事件的节点到根节点上所有的 mark: 属性值；而 dataset 仅包含一个节点的 data- 属性值
5、如果存在同名的 mark ，父节点的 mark 会被子节点覆盖。
6、在自定义组件中接收事件时， mark 不包含自定义组件外的节点的 mark。
7、不同于 dataset ，节点的 mark 不会做连字符和大小写转换。
自定义组件
1、其定义方式与react类似，页面ui结合属性传入，形成一个可复用的ui模版。
2、在自定义的组件模板中可以提供一个 <slot> 节点，用于承载被引用时，嵌套在自定义组件标签内的子节点元素。默认情况下，一个组件的wxml中只能有一个slot。需要使用多slot时，可以在组件js中声明启用。
、、、
Component({
options: {
multipleSlots: true // 在组件定义时的选项中启用多slot支持
},
properties: { /* ... / },
methods: { / ... */ }
})
、、、
3、自定义组件尽量使用class选择器，其他选择器可能出现问题，全局样式此时不生效。
4、自定义组件支持默认样式，
、、、
:host {
color: yellow;
}
、、、
5、使用 Component 构造器来构造页面的一个好处是可以使用 behaviors 来提取所有页面中公用的代码段。
、、、
// page-common-behavior.js
module.exports = Behavior({
attached: function() {
// 页面创建时执行
console.info('Page loaded!')
},
detached: function() {
// 页面销毁时执行
console.info('Page unloaded!')
}
})
// 页面 A
var pageCommonBehavior = require('./page-common-behavior')
Component({
behaviors: [pageCommonBehavior],
data: { /* ... / },
methods: { / ... */ },
})
// 页面 B
var pageCommonBehavior = require('./page-common-behavior')
Component({
behaviors: [pageCommonBehavior],
data: { /* ... / },
methods: { / ... */ },
})
、、、
6、可以使用lifetimes、pageLifetimes在组件的构造函数中，申明当前组件的生命周期及其被引用的当前组件所在的page中的生命周期，便于捕获生命周期做适当的处理。
网友评论