微信小程序【生命週期】

小程序分爲應用、頁面和組件三個部分，所以小程序的生命週期涉及以下

1. 應用的生命週期
2. 頁面的生命週期
3. 組件的聲明週期
4. 應用的生命週期對頁面生命週期的影響

應用的生命週期

App() 函數用來註冊一個小程序。接受一個 Object 參數，其指定小程序的生命週期回調等。
App() 必須在 app.js 中調用，必須調用且只能調用一次。

App({
  onLaunch: function(options) {
    // 監聽小程序初始化。小程序初始化完成時（全局只觸發一次）
  },
  onShow: function(options) {
    // 監聽小程序顯示。小程序啓動，或從後臺進入前臺顯示時
  },
  onHide: function() {
    // 監聽小程序隱藏。小程序從前臺進入後臺時。
  },
  onError: function(msg) {
    console.log(msg) // 錯誤監聽函數。小程序發生腳本錯誤，或者 api 調用失敗時觸發，會帶上錯誤信息
  },
  onPageNotFound: function(res) {
    // 頁面不存在監聽函數。小程序要打開的頁面不存在時觸發，會帶上頁面信息回調該函數
  },
  globalData: 'I am global data'  //全局變量
})

前臺、後臺定義： 當用戶點擊左上角關閉，或者按了設備 Home 鍵離開微信，小程序並沒有直接銷燬，而是進入了後臺；當再次進入微信或再次打開小程序，又會從後臺進入前臺。

1. 用戶首次打開小程序，觸發 onLaunch 方法（全局只觸發一次）。
2. 小程序初始化完成後，觸發 onShow 方法，監聽小程序顯示。
3. 小程序從前臺進入後臺，觸發 onHide 方法。
4. 小程序從後臺進入前臺顯示，觸發 onShow 方法。
5. 小程序後臺運行一定時間，或系統資源佔用過高，會被銷燬。

全局的 getApp() 函數可以用來獲取到小程序 App 實例。
寫法：var app = getApp()

注意：不要在定義於 App() 內的函數中調用 getApp() ，使用 this 就可以拿到 app 實例；通過 getApp() 獲取實例之後，不要私自調用生命週期函數

頁面的生命週期

Page(Object) 函數用來註冊一個頁面。接受一個 Object 類型參數，其指定頁面的初始數據、生命週期回調、事件處理函數等。

//index.js
Page({
  data: {
    // 頁面的初始數據
    text: "This is page data."
  },
  onLoad: function(options) {
    // 生命週期回調—監聽頁面加載
  },
  onReady: function() {
    // 生命週期回調—監聽頁面初次渲染完成
  },
  onShow: function() {
    // 生命週期回調—監聽頁面顯示
  },
  onHide: function() {
    // 生命週期回調—監聽頁面隱藏
  },
  onUnload: function() {
    // 生命週期回調—監聽頁面卸載
  },
  onPullDownRefresh: function() {
    // 監聽用戶下拉動作
  },
  onReachBottom: function() {
    // 頁面上拉觸底事件的處理函數
  },
  onShareAppMessage: function () {
    // 用戶點擊右上角轉發
  },
  onPageScroll: function() {
    // 頁面滾動觸發事件的處理函數
  },
  onResize: function() {
    // 頁面尺寸改變時觸發
  },
  onTabItemTap(item) {
    // 當前是 tab 頁時，點擊 tab 時觸發
    console.log(item.index)
    console.log(item.pagePath)
    console.log(item.text)
  },
  // 任意的函數，在頁面的函數中用 this 可以訪問
  viewTap: function() {
    this.setData({
      text: 'Set some data for updating view.'
    }, function() {
      // this is setData callback
    })
  },
  // 任意數據，在頁面的函數中用 this 可以訪問
  customData: {
    hi: 'MINA'
  }
})

頁面生命週期圖

1. 小程序註冊完成後，加載頁面，觸發onLoad方法。
2. 頁面載入後觸發onShow方法，顯示頁面。
3. 首次顯示頁面，會觸發onReady方法，渲染頁面元素和樣式，一個頁面只會調用一次。
4. 當小程序後臺運行或跳轉到其他頁面時，觸發onHide方法。
5. 當小程序有後臺進入到前臺運行或重新進入頁面時，觸發onShow方法。
6. 當使用重定向方法wx.redirectTo(object)或關閉當前頁返回上一頁wx.navigateBack()，觸發onUnload。

總結：

1. onLoad: 頁面加載。一個頁面只會調用一次。參數可以獲取wx.navigateTo和wx.redirectTo及中的 query。
2. onShow: 頁面顯示。每次打開頁面都會調用一次。
3. onReady: 頁面初次渲染完成。一個頁面只會調用一次，代表頁面已經準備妥當，可以和視圖層進行交互。對界面的設置如wx.setNavigationBarTitle請在onReady之後設置。
4. onHide: 頁面隱藏。當navigateTo或底部tab切換時調用。
5. onUnload: 頁面卸載。當redirectTo或navigateBack的時候調用。

組件的生命週期

組件的生命週期，指的是組件自身的一些函數，這些函數在特殊的時間點或遇到一些特殊的框架事件時被自動觸發。

其中，最重要的生命週期是 created attached detached ，包含一個組件實例生命流程的最主要時間點。

1. created 組件實例化，但節點樹還未導入，因此這時不能用setData
2. attached 組件初始化完畢，節點樹完成，可以用setData渲染節點，但無法操作節點
3. ready 組件佈局完成，這時可以獲取節點信息，也可以操作節點
4. moved 組件實例被移動到樹的另一個位置
5. detached 組件實例從節點樹中移

組件所在頁面的生命週期, 指的是那些並非與組件有很強的關聯，但有時組件需要獲知，以便組件內部處理的生命週期，在 pageLifetimes 定義段中定義。

1. show 組件所在的頁面被展示時執行
2. hide 組件所在的頁面被隱藏時執行
3. resize 組件所在的頁面尺寸變化時執行

應用的生命週期對頁面生命週期的影響

1. 小程序初始化完成後，頁面首次加載觸發onLoad，只會觸發一次。
2. 當小程序進入到後臺，先執行頁面onHide方法再執行應用onHide方法。
3. 當小程序從後臺進入到前臺，先執行應用onShow方法再執行頁面onShow方法。