微信小程式學習筆記(4)--------框架之邏輯層
邏輯層
邏輯層(App Service):小程式框架的邏輯層是由JavaScript編寫的,邏輯層將資料進行處理後傳送給檢視層,同時接受檢視層的事件反饋。
App進行程式註冊,Page進行頁面註冊
getApp獲取App例項,getCurrentPages獲取當前頁面棧
一、程式註冊
1、App
App()函式用來註冊小程式。接受一個Object引數,其指定小程式的生命週期函式。
注意:App()必須在app.js中註冊,而且不能註冊多個
Object引數說明
屬性 |
型別 |
描述 |
觸發時機 |
onLaunch |
Function |
生命週期函式--初始化 |
初始化完成是,只會觸發一次 |
onShow |
Function |
生命明明周期函式--小程式顯示 |
啟動時,或從後臺進入前臺顯示 |
onHide |
Function |
生命週期函式--小程式隱藏 |
從前臺進入後臺 |
其他 |
Any |
開發者可以新增任意的函式或資料到Object引數中,用this可以訪問 |
2、getApp()
getApp()是全域性函式,可以獲取小程式例項。
注意:不要在定義App()內的函式中呼叫getApp(),使用this就可以拿到app例項。通過getApp()獲取例項後,不要私自呼叫生命週期函式。
3、getCurrentPages()
不要在onLaunch的時候呼叫getCurrentPages(),app還沒有生成。
二、頁面註冊
Page
Page()函式用來註冊一個頁面,接受一個Object引數,其指定頁面的初始資料、生命週期函式、事件處理函式等。
屬性 |
型別 |
描述 |
data |
Object |
頁面的初始資料 |
onLoad |
Function |
生命週期函式--監聽頁面載入 |
onReady |
Function |
生命週期函式--監聽頁面初次渲染完成 |
onShow |
Function |
生命週期函式--監聽頁面顯示 |
onHide |
Function |
生命週期函式--監聽頁面隱藏 |
onUnload |
Function |
生命週期函式--監聽頁面解除安裝 |
onPullDownRefresh |
Function |
頁面相關事件處理函式--監聽使用者下拉動作 |
onReachBottom |
Function |
頁面上拉觸底事件的處理函式 |
其他 |
Any |
開發者可以新增任意的函式或資料到 object 引數中,在頁面的函式中用 this 可以訪問 |
1、初始化資料
初始化資料將作為頁面的第一次渲染。data將會以JSON的形式由邏輯層傳至渲染層,所以其資料必須是可以轉換成JSON的格式:字串,數字,布林值,物件,陣列。
渲染層可以通過wxml對資料進行繫結。
2、生命週期函式
(1)、onLoad:頁面載入
一個頁面只會呼叫一次
接收頁面引數可以獲取wx.navigateTo和wx.redirectTo及<navigator/>中的 query。
(2)、onShow:頁面顯示
每次開啟頁面都會呼叫 一次
(3)、onReady:頁面初次渲染完成。
一個頁面只會呼叫一次,代表頁面已經準備妥當,可以和試圖層進行互動
(4)、onHide:頁面隱藏
當navigateTo或底部tab切換時呼叫。
(5)、onUnload:頁面解除安裝
當redirectTo或navigateBack的時候呼叫。
3、頁面相關事件處理函式
OnPullDownRefresh:下拉重新整理需要在config的windows選項中開啟enablePullDownRefresh。當處理完資料重新整理後,wx.stopPullDownRefresh可以停止當前頁面的下拉重新整理。
4、事件處理函式
除了初始化資料和生命週期函式,Page 中還可以定義一些特殊的函式:事件處理函式。在渲染層可以在元件中加入事件繫結,當達到觸發事件時,就會執行 Page 中定義的事件處理函式。
Page.prototype.setData()
setData 函式用於將資料從邏輯層傳送到檢視層,同時改變對應的 this.data 的值。
注意:
1. 直接修改 this.data 無效,無法改變頁面的狀態,還會造成資料不一致。
2. 單次設定的資料不能超過1024kB,請儘量避免一次設定過多的資料。
setData() 引數格式
接受一個物件,以 key,value 的形式表示將 this.data 中的 key 對應的值改變成 value。
其中 key 可以非常靈活,以資料路徑的形式給出。
getCurrentPages()
getCurrentPages() 函式用於獲取當前頁面棧的例項,以陣列形式按棧的順序給出,第一個元素為首頁,最後一個元素為當前頁面。
注意:不要嘗試修改頁面棧,會導致路由以及頁面狀態錯誤。
三、模組化
檔案作用域
在 JavaScript 檔案中宣告的變數和函式只在該檔案中有效;不同的檔案中可以宣告相同名字的變數和函式,不會互相影響。
通過全域性函式 getApp()可以獲取全域性的應用例項,如果需要全域性的資料可以在 App() 中設定。
模組化
我們可以將一些公共的程式碼抽離成為一個單獨的 js 檔案,作為一個模組。模組只有通過 module.exports 或者 exports 才能對外暴露介面。
需要注意的是:
exports 是 module.exports 的一個引用,因此在模組裡邊隨意更改 exports 的指向會造成未知的錯誤。所以我們更推薦開發者採用module.exports 來暴露模組介面。