1. 程式人生 > >微信小程式學習筆記(4)--------框架之邏輯層

微信小程式學習筆記(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 來暴露模組介面。

四、API