微信小程序 小程序的生命周期（三種）

全局生命周期的話就是 app.js 里面中的 

是App() 這個函數的：

App({

  /**
   * 當小程序初始化完成時，會觸發 onLaunch（全局只觸發一次）
   */
  onLaunch: function () {
    
  },

  /**
   * 當小程序啟動，或從后台進入前台顯示，會觸發 onShow
   */
  onShow: function (options) {
    
  },

  /**
   * 當小程序從前台進入后台，會觸發 onHide
   */
  onHide: function () {
    
  },

  /**
   * 當小程序發生腳本錯誤，或者 api 調用失敗時，會觸發 onError 並帶上錯誤信息
   */
  onError: function (msg) {
    
  }
})

 

屬性	類型	默認值	必填	說明	最低版本
onLaunch	function		否	生命周期回調——監聽小程序初始化。//只會執行一次
onShow	function		否	生命周期回調——監聽小程序啟動或切前台。
onHide	function		否	生命周期回調——監聽小程序切后台。
onError	function		否	錯誤監聽函數。
onPageNotFound	function		否	頁面不存在監聽函數。//即入口頁面不存在	1.9.90
onUnhandledRejection	function		否	未處理的 Promise 拒絕事件監聽函數。	2.10.0
onThemeChange	function		否	監聽系統主題變化	2.11.0
其他	any		否	開發者可以添加任意的函數或數據變量到 Object 參數中，用 this 可以訪問

 

你可以去測試下 其實不難。

 

頁面的生命周期

頁面的生命周期其實就是Page：

 

其次：

屬性	類型	默認值	必填	說明
data	Object			頁面的初始數據
options	Object			頁面的組件選項，同 Component 構造器 中的 options ，需要基礎庫版本 2.10.1
onLoad	function			生命周期回調—監聽頁面加載
onShow	function			生命周期回調—監聽頁面顯示
onReady	function			生命周期回調—監聽頁面初次渲染完成
onHide	function			生命周期回調—監聽頁面隱藏
onUnload	function			生命周期回調—監聽頁面卸載
onPullDownRefresh	function			監聽用戶下拉動作
onReachBottom	function			頁面上拉觸底事件的處理函數
onShareAppMessage	function			用戶點擊右上角轉發
onShareTimeline	function			用戶點擊右上角轉發到朋友圈
onAddToFavorites	function			用戶點擊右上角收藏
onPageScroll	function			頁面滾動觸發事件的處理函數
onResize	function			頁面尺寸改變時觸發，詳見 響應顯示區域變化
onTabItemTap	function			當前是 tab 頁時，點擊 tab 時觸發
onSaveExitState	function			頁面銷毀前保留狀態回調
其他	any			開發者可以添加任意的函數或數據到 Object 參數中，在頁面的函數中用 this 可以訪問

Page({

  /**
   * 頁面的初始數據
   */
  data: {
    
  },

  /**
   * 生命周期函數--監聽頁面加載
   */
  onLoad: function (options) {
    
  },

  /**
   * 生命周期函數--監聽頁面初次渲染完成
   */
  onReady: function () {
    
  },

  /**
   * 生命周期函數--監聽頁面顯示
   */
  onShow: function () {
    
  },

  /**
   * 生命周期函數--監聽頁面隱藏
   */
  onHide: function () {
    
  },

  /**
   * 生命周期函數--監聽頁面卸載
   */
  onUnload: function () {
    
  },

  /**
   * 頁面相關事件處理函數--監聽用戶下拉動作
   */
  onPullDownRefresh: function () {
    
  },

  /**
   * 頁面上拉觸底事件的處理函數
   */
  onReachBottom: function () {
    
  },

  /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

Page({

  /**
   * 頁面的初始數據
   */
  data: {
    
  },

  /**
   * 生命周期函數--監聽頁面加載
   */
  onLoad: function (options) {
    console.log("options" + options);
  },

  /**
   * 生命周期函數--監聽頁面初次渲染完成
   */
  onReady: function () {
    console.log("渲染完成");
  },

  /**
   * 生命周期函數--監聽頁面顯示
   */
  onShow: function () {
    console.log("頁面顯示完成");
  },

  /**
   * 生命周期函數--監聽頁面隱藏
   */
  onHide: function () {
    console.log("頁面隱藏");
  },

  /**
   * 生命周期函數--監聽頁面卸載
   */
  onUnload: function () {
    console.log("頁面卸載");
  },

  /**
   * 頁面相關事件處理函數--監聽用戶下拉動作
   */
  onPullDownRefresh: function () {
    console.log("下拉動作觸發！");
  },

  /**
   * 頁面上拉觸底事件的處理函數
   */
  onReachBottom: function () {
    console.log("拉觸底事件");
  },

  /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function () {
    console.log("已點擊分享！");
  }
})

 按照調試的來 調試一下即可

 

 

組件生命周期

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

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

• 組件實例剛剛被創建好時， created 生命周期被觸發。此時，組件數據 this.data 就是在 Component 構造器中定義的數據 data 。 此時還不能調用 setData 。 通常情況下，這個生命周期只應該用於給組件 this 添加一些自定義屬性字段。
• 在組件完全初始化完畢、進入頁面節點樹后， attached 生命周期被觸發。此時， this.data 已被初始化為組件的當前值。這個生命周期很有用，絕大多數初始化工作可以在這個時機進行。
• 在組件離開頁面節點樹后， detached 生命周期被觸發。退出一個頁面時，如果組件還在頁面節點樹中，則 detached 會被觸發。

定義生命周期方法

生命周期方法可以直接定義在 Component 構造器的第一級參數中。

自小程序基礎庫版本 2.2.3 起，組件的的生命周期也可以在 lifetimes 字段內進行聲明（這是推薦的方式，其優先級最高）。