App()
App() 函數(shù)用來注冊一個小程序蝇庭。接受一個 object 參數(shù)，其指定小程序的生命周期函數(shù)等旋恼。
object參數(shù)說明：
前臺乘陪、后臺定義： 當用戶點擊左上角關(guān)閉统台，或者按了設(shè)備 Home 鍵離開微信，小程序并沒有直接銷毀啡邑，而是進入了后臺贱勃；當再次進入微信或再次打開小程序，又會從后臺進入前臺。
只有當小程序進入后臺一定時間贵扰，或者系統(tǒng)資源占用過高仇穗，才會被真正的銷毀。
示例代碼：
App({
onLaunch: function() {
// Do something initial when launch.
},
onShow: function() {
// Do something when show.
},
onHide: function() {
// Do something when hide.
},
globalData: 'I am global data'
})
App.prototype.getCurrentPage()
getCurrentPage() 函數(shù)用戶獲取當前頁面的實例戚绕。
getApp()
我們提供了全局的 getApp() 函數(shù)纹坐，可以獲取到小程序?qū)嵗?/p>
// other.js
var appInstance = getApp()
console.log(appInstance.globalData) // I am global data
注意：
App() 必須在 app.js 中注冊，且不能注冊多個舞丛。
不要在定義于 App() 內(nèi)的函數(shù)中調(diào)用 getApp() 耘子，使用 this 就可以拿到 app 實例。
不要在 onLaunch 的時候調(diào)用 getCurrentPage()球切，此時 page 還沒有生成谷誓。
通過 getApp() 獲取實例之后，不要私自調(diào)用生命周期函數(shù)吨凑。
Page
Page() 函數(shù)用來注冊一個頁面捍歪。接受一個 object 參數(shù)，其指定頁面的初始數(shù)據(jù)怀骤、生命周期函數(shù)费封、事件處理函數(shù)等。
object 參數(shù)說明：
示例代碼：
//index.js
Page({
data: {
text: "This is page data."
},
onLoad: function(options) {
// Do some initialize when page load.
},
onReady: function() {
// Do something when page ready.
},
onShow: function() {
// Do something when page show.
},
onHide: function() {
// Do something when page hide.
},
onUnload: function() {
// Do something when page close.
},
onPullDownRefresh: function() {
// Do something when pull down
},
// Event handler.
viewTap: function() {
this.setData({
text: 'Set some data for updating view.'
})
}
})
初始化數(shù)據(jù)
初始化數(shù)據(jù)將作為頁面的第一次渲染蒋伦。data 將會以 JSON 的形式由邏輯層傳至渲染層，所以其數(shù)據(jù)必須是可以轉(zhuǎn)成 JSON 的格式：字符串焚鹊，數(shù)字痕届，布爾值，對象末患，數(shù)組研叫。
渲染層可以通過 WXML 對數(shù)據(jù)進行綁定。
示例代碼：
<view>{{text}}</view>
<view>{{array[0].msg}}</view>
Page({
data: {
text: 'init data',
array: [{msg: '1'}, {msg: '2'}]
}
})
生命周期函數(shù)
onLoad: 頁面加載
一個頁面只會調(diào)用一次璧针。
參數(shù)可以獲取wx.navigateTo和wx.redirectTo及<navigator/>中的 query嚷炉。
onShow: 頁面顯示
每次打開頁面都會調(diào)用一次。
onReady: 頁面初次渲染完成
一個頁面只會調(diào)用一次探橱，代表頁面已經(jīng)準備妥當申屹，可以和視圖層進行交互。
對界面的設(shè)置如wx.setNavigationBarTitle請在onReady之后設(shè)置隧膏。詳見生命周期
onHide: 頁面隱藏
當navigateTo或底部tab切換時調(diào)用哗讥。
onUnload: 頁面卸載
當redirectTo或navigateBack的時候調(diào)用。
頁面相關(guān)事件處理函數(shù)
-
onPullDownRefresh: 下拉刷新- 監(jiān)聽用戶下拉刷新事件胞枕。
- 需要在
config的window選項中開啟enablePullDownRefresh杆煞。 - 當處理完數(shù)據(jù)刷新后，
wx.stopPullDownRefresh可以停止當前頁面的下拉刷新。
事件處理函數(shù)
除了初始化數(shù)據(jù)和生命周期函數(shù)决乎，Page 中還可以定義一些特殊的函數(shù)：事件處理函數(shù)队询。在渲染層可以在組件中加入事件綁定，當達到觸發(fā)事件時构诚，就會執(zhí)行 Page 中定義的事件處理函數(shù)蚌斩。
示例代碼：
<view bindtap="viewTap"> click me </view>
Page({
viewTap: function() {
console.log('view tap')
}
})
Page.prototype.setData()
setData 函數(shù)用于將數(shù)據(jù)從邏輯層發(fā)送到視圖層，同時改變對應的 this.data 的值唤反。
注意：
1.直接修改 this.data 無效凳寺，無法改變頁面的狀態(tài)，還會造成數(shù)據(jù)不一致彤侍。
2.單次設(shè)置的數(shù)據(jù)不能超過1024kB肠缨，請盡量避免一次設(shè)置過多的數(shù)據(jù)。
setData() 參數(shù)格式
接受一個對象盏阶，以 key晒奕，value 的形式表示將 this.data 中的 key 對應的值改變成 value。
其中 key 可以非常靈活名斟，以數(shù)據(jù)路徑的形式給出脑慧，如 array[2].message，a.b.c.d砰盐，并且不需要在 this.data 中預先定義闷袒。
示例代碼：
<!--index.wxml-->
<view>{{text}}</view>
<button bindtap="changeText"> Change normal data </button>
<view>{{array[0].text}}</view>
<button bindtap="changeItemInArray"> Change Array data </button>
<view>{{obj.text}}</view>
<button bindtap="changeItemInObject"> Change Object data </button>
<view>{{newField.text}}</view>
<button bindtap="addNewField"> Add new data </button>
//index.js
Page({
data: {
text: 'init data',
array: [{text: 'init data'}],
object: {
text: 'init data'
}
},
changeText: function() {
// this.data.text = 'changed data' // bad, it can not work
this.setData({
text: 'changed data'
})
},
changeItemInArray: function() {
// you can use this way to modify a danamic data path
this.setData({
'array[0].text':'changed data'
})
},
changeItemInObject: function(){
this.setData({
'object.text': 'changed data'
});
},
addNewField: function() {
this.setData({
'newField.text': 'new data'
})
}
})
以下內(nèi)容你不需要立馬完全弄明白，不過以后它會有幫助岩梳。
生命周期
下圖說明了 Page 實例的生命周期囊骤。
頁面的路由
在小程序中所有頁面的路由全部由框架進行管理，對于路由的觸發(fā)方式以及頁面生命周期函數(shù)如下：
