邏輯層
一、關(guān)于目錄結(jié)構(gòu)和配置文檔;
二、App() 在 app.js 中注冊(cè)文檔;
App({
onLaunch: function(options) {
// 生命周期函數(shù)--監(jiān)聽小程序初始化
// 當(dāng)小程序初始化完成時(shí)，會(huì)觸發(fā) onLaunch（全局只觸發(fā)一次）
},
onShow: function(options) {
// 生命周期函數(shù)--監(jiān)聽小程序顯示
// 當(dāng)小程序啟動(dòng)，或從后臺(tái)進(jìn)入前臺(tái)顯示，會(huì)觸發(fā) onShow
},
onHide: function() {
// 生命周期函數(shù)--監(jiān)聽小程序隱藏
// 當(dāng)小程序從前臺(tái)進(jìn)入后臺(tái)，會(huì)觸發(fā) onHide
},
onError: function(msg) {
// 錯(cuò)誤監(jiān)聽函數(shù)
// 當(dāng)小程序發(fā)生腳本錯(cuò)誤，或者 api 調(diào)用失敗時(shí)，會(huì)觸發(fā) onError 并帶上錯(cuò)誤信息
console.log(msg)
},
onPageNotFound(res) {
// 頁面不存在監(jiān)聽函數(shù)
// 當(dāng)小程序出現(xiàn)要打開的頁面不存在的情況，會(huì)帶上頁面信息回調(diào)該函數(shù)
wx.redirectTo({
url: 'pages/...'
}) // 如果是 tabbar 頁面，請(qǐng)使用 wx.switchTab
},
globalData: 'I am global data'
})
前臺(tái)、后臺(tái)定義： 當(dāng)用戶點(diǎn)擊左上角關(guān)閉，或者按了設(shè)備 Home 鍵離開微信，小程序并沒有直接銷毀，而是進(jìn)入了后臺(tái)；當(dāng)再次進(jìn)入微信或再次打開小程序，又會(huì)從后臺(tái)進(jìn)入前臺(tái)。需要注意的是：只有當(dāng)小程序進(jìn)入后臺(tái)一定時(shí)間，或者系統(tǒng)資源占用過高，才會(huì)被真正的銷毀。
onLaunch, onShow 參數(shù)
具體場(chǎng)景值：傳送門
getApp()
全局的 getApp() 函數(shù)可以用來獲取到小程序?qū)嵗?/p>
// other.js
var appInstance = getApp()
console.log(appInstance.globalData) // I am global data
注意：
App() 必須在 app.js 中注冊(cè)，且不能注冊(cè)多個(gè)。
不要在定義于 App() 內(nèi)的函數(shù)中調(diào)用 getApp() ，使用 this 就可以拿到 app 實(shí)例。
不要在 onLaunch 的時(shí)候調(diào)用 getCurrentPages()，此時(shí) page 還沒有生成。
通過 getApp() 獲取實(shí)例之后，不要私自調(diào)用生命周期函數(shù)。
三、頁面注冊(cè)page()文檔;
生命周期函數(shù)
Page({
data: {
getData: app.data
},
onLoad: function (options) {
// 頁面初始化 options為頁面跳轉(zhuǎn)所帶來的參數(shù)
},
onReady: function () {
// 頁面渲染完成
},
onShow: function () {
// 頁面顯示
},
onHide: function () {
// 頁面隱藏
},
onUnload: function () {
// 頁面關(guān)閉
},
onPullDownRefresh:function(){
//下拉操作
},
onReachBottom: function() {
//上拉操作
},
onShareAppMessage: function () {
// 右上角分享.
}
})
四、路由文檔;
1、getCurrentPages()
getCurrentPages() 函數(shù)用于獲取當(dāng)前頁面棧的實(shí)例，以數(shù)組形式按棧的順序給出，第一個(gè)元素為首頁，最后一個(gè)元素為當(dāng)前頁面。
2、Tips:參考
navigateTo, redirectTo 只能打開非 tabBar 頁面。
switchTab 只能打開 tabBar 頁面。
reLaunch 可以打開任意頁面。
頁面底部的 tabBar 由頁面決定，即只要是定義為 tabBar 的頁面，底部都有 tabBar。
調(diào)用頁面路由帶的參數(shù)可以在目標(biāo)頁面的onLoad中獲取。
視圖層
一、WXML
1、數(shù)據(jù)綁定：文檔
（1）、基本用法雙括號(hào)：
<view> {{ message }} </view>
Page({
data: {
message: 'Hello MINA!'
}
})
（2）、
組件屬性(需要在雙引號(hào)之內(nèi))
<view id="item-{{id}}"> </view>
Page({
data: {
id: 0
}
})
控制屬性(需要在雙引號(hào)之內(nèi))
<view wx:if="{{condition}}"> </view>
Page({
data: {
condition: true
}
})
關(guān)鍵字(需要在雙引號(hào)之內(nèi))
true：boolean 類型的 true，代表真值。
false： boolean 類型的 false，代表假值。
<checkbox checked="{{false}}"> </checkbox>
特別注意：不要直接寫 checked="false"，其計(jì)算結(jié)果是一個(gè)字符串，轉(zhuǎn)成 boolean 類型后代表真值。
（3）、可在花括號(hào)運(yùn)算
（4）、可以在 Mustache 內(nèi)直接進(jìn)行組合，構(gòu)成新的對(duì)象或者數(shù)組。
數(shù)組
<view wx:for="{{[zero, 1, 2, 3, 4]}}"> {{item}} </view>
Page({
data: {
zero: 0
}
})
最終組合成數(shù)組[0, 1, 2, 3, 4]。
對(duì)象
<template is="objectCombine" data="{{for: a, bar: b}}"></template>
Page({
data: {
a: 1,
b: 2
}
})
最終組合成的對(duì)象是 {for: 1, bar: 2}
也可以用擴(kuò)展運(yùn)算符 ... 來將一個(gè)對(duì)象展開
<template is="objectCombine" data="{{...obj1, ...obj2, e: 5}}"></template>
Page({
data: {
obj1: {
a: 1,
b: 2
},
obj2: {
c: 3,
d: 4
}
}
})
最終組合成的對(duì)象是 {a: 1, b: 2, c: 3, d: 4, e: 5}。
如果對(duì)象的 key 和 value 相同，也可以間接地表達(dá)。
<template is="objectCombine" data="{{foo, bar}}"></template>
Page({
data: {
foo: 'my-foo',
bar: 'my-bar'
}
})
最終組合成的對(duì)象是 {foo: 'my-foo', bar:'my-bar'}。
注意：上述方式可以隨意組合，但是如有存在變量名相同的情況，后邊的會(huì)覆蓋前面，如：
<template is="objectCombine" data="{{...obj1, ...obj2, a, c: 6}}"></template>
Page({
data: {
obj1: {
a: 1,
b: 2
},
obj2: {
b: 3,
c: 4
},
a: 5
}
})
最終組合成的對(duì)象是 {a: 5, b: 3, c: 6}。
注意： 花括號(hào)和引號(hào)之間如果有空格，將最終被解析成為字符串
<view wx:for="{{[1,2,3]}} ">
{{item}}
</view>
等同于
<view wx:for="{{[1,2,3] + ' '}}">
{{item}}
</view>
2、列表渲染文檔
<view wx:for="{{array}}">
{{index}}: {{item.message}}
</view>
使用 wx:for-item 可以指定數(shù)組當(dāng)前元素的變量名，
使用 wx:for-index 可以指定數(shù)組當(dāng)前下標(biāo)的變量名：
<view wx:for="{{array}}" wx:for-index="idx" wx:for-item="itemName">
{{idx}}: {{itemName.message}}
</view>
block wx:for
類似 block wx:if，也可以將 wx:for 用在<block/>標(biāo)簽上，以渲染一個(gè)包含多節(jié)點(diǎn)的結(jié)構(gòu)塊。例如：
<block wx:for="{{[1, 2, 3]}}">
<view> {{index}}: </view>
<view> {{item}} </view>
</block>
wx:key
如果列表中項(xiàng)目的位置會(huì)動(dòng)態(tài)改變或者有新的項(xiàng)目添加到列表中，并且希望列表中的項(xiàng)目保持自己的特征和狀態(tài)（如 <input/> 中的輸入內(nèi)容，<switch/> 的選中狀態(tài)），需要使用 wx:key 來指定列表中項(xiàng)目的唯一的標(biāo)識(shí)符。
wx:key 的值以兩種形式提供
字符串，代表在 for 循環(huán)的 array 中 item 的某個(gè) property，該 property 的值需要是列表中唯一的字符串或數(shù)字，且不能動(dòng)態(tài)改變。
保留關(guān)鍵字 *this 代表在 for 循環(huán)中的 item 本身，這種表示需要 item 本身是一個(gè)唯一的字符串或者數(shù)字，如：
當(dāng)數(shù)據(jù)改變觸發(fā)渲染層重新渲染的時(shí)候，會(huì)校正帶有 key 的組件，框架會(huì)確保他們被重新排序，而不是重新創(chuàng)建，以確保使組件保持自身的狀態(tài)，并且提高列表渲染時(shí)的效率。
如不提供 wx:key，會(huì)報(bào)一個(gè) warning， 如果明確知道該列表是靜態(tài)，或者不必關(guān)注其順序，可以選擇忽略。
注意：
當(dāng) wx:for 的值為字符串時(shí)，會(huì)將字符串解析成字符串?dāng)?shù)組
<view wx:for="array">
{{item}}
</view>
等同于
<view wx:for="{{['a','r','r','a','y']}}">
{{item}}
</view>
注意： 花括號(hào)和引號(hào)之間如果有空格，將最終被解析成為字符串
<view wx:for="{{[1,2,3]}} ">
{{item}}
</view>
等同于
<view wx:for="{{[1,2,3] + ' '}}" >
{{item}}
</view>
3、條件渲染文檔
wx:if
在框架中，使用 wx:if="{{condition}}" 來判斷是否需要渲染該代碼塊：
<view wx:if="{{condition}}"> True </view>
也可以用 wx:elif 和 wx:else 來添加一個(gè) else 塊：
<view wx:if="{{length > 5}}"> 1 </view>
<view wx:elif="{{length > 2}}"> 2 </view>
<view wx:else> 3 </view>
block wx:if
wx:if vs hidden
4、模板文檔;
參考：https://blog.csdn.net/u013778905/article/details/59646241
5、事件文檔
參考：http://www.wxappclub.com/topic/543
6、應(yīng)用文檔
二、wxs文檔
參考：http://www.wxapp-union.com/article-3015-1.html
