淺析微信小程序生命週期之應用生命週期

淺談微信小程序生命週期之應用生命週期

參考:微信小程序官方文檔

微信小程序生命週期可分爲應用生命週期、頁面生命週期和組件生命週期,本文結合微信官方文檔淺析微信小程序的應用生命週期。從註冊一個小程序生命週期開始講起,到一些關於開發的小經驗。廢話少說,直接來。

1、App(Object object)
微信小程序應用生命週期從註冊小程序生命週期開始說起,拿Vue.js這比喻,我們要使用Vue就得先new一個Vue對象。而微信小程序通過App(Object object)這個函數來註冊小程序,接受一個 Object 參數,其指定小程序的生命週期回調等。
Tip: App() 必須在 app.js 中調用,必須調用且只能調用一次。不然會出現無法預期的後果。

2、App()參數
App(Object object)也可稱爲註冊程序,這個程序裏包含了些關於小程序生命週期相關的函數。或稱爲App()函數的參數,參數類型是Object object。如下

屬性 類型 說明 觸發時間
onLaunch function 生命週期回調——監聽小程序初始化。 小程序初始化完成時觸發,全局只觸發一次。
onShow function 生命週期回調——監聽小程序啓動或切前臺。 小程序啓動,或從後臺進入前臺顯示時觸發。
onHide function 生命週期回調——監聽小程序切後臺。 小程序從前臺進入後臺時觸發。
onError function 錯誤監聽函數。 小程序發生腳本錯誤或 API 調用報錯時觸發。
onPageNotFound function 頁面不存在監聽函數。 小程序要打開的頁面不存在時觸發。基礎庫 1.9.90 開始支持
onUnhandledRejection function 未處理的 Promise 拒絕事件監聽函數。 小程序有未處理的 Promise 拒絕時觸發。基礎庫 2.10.0 開始支持。
onThemeChange function 監聽系統主題變化 系統切換主題時觸發。基礎庫 2.11.0 開始支持。
其他 any 開發者可以添加任意的函數或數據變量到 Object 參數中,用 this 可以訪問

3、示例代碼

App({
  onLaunch (options) {
    // Do something initial when launch.
  },
  onShow (options) {
    // Do something when show.
  },
  onHide () {
    // Do something when hide.
  },
  onError (msg) {
    console.log(msg)
  },
  globalData: 'I am global data'
})

這裏需要特別說明的是 globalData 這個函數/對象,這裏可以寫成函數也可以寫成一個單獨的變量,這個函數的作用通常是存儲全局變量。例如我們在開發過程中可以將後端給的API鏈接前綴寫在這裏,這樣在項目上線的時候更改API前綴我們就不用一個個去改。如下
app.js中

//當要存儲多個全局變量時,應該這樣寫
globalData: {
    userInfo: null,
    urlFirst:'http://192.168.1.15:8089/AppleCampus/f'
  }

再需要使用的頁面js文件下,例如index.js中,這樣去使用

//index.js
//獲取應用實例
const app = getApp()

Page({
  data: {
    //……
  },
  onLoad: function () {
    wx.request({
    //使用應用實例對象app去點訪問app.js下的globalData函數下的urlFirst 變量
      url: app.globalData.urlFirst + '/module/index/getScheduleData', 
      data: {},
      success(res) {
      }
    });
})

這裏最後描述的全局表量的使用其實就相當於一點自己的開發經驗了。

上一篇:詳解微信小程序目錄結構,淺析微信小程序技術架構

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章