小程序學習-小程序生命周期和頁面生命周期

小程序生命周期App.js

小程序的生命周期函數是在app.js里面調用的，App(Object)函數用來注冊一個小程序。接受一個 Object 參數，指定其小程序的生命周期回調.

 

 

 

 

 

App({

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

    var userInfo = wx.getStorageSync('userInfo');
    if (userInfo) {
      this.globalData.userInfo = userInfo;
    }

  },
onShow(): function() {
  console.log('onShow監聽小程序顯示');
},

onHide(): function() {
  console.log('onLaunch監聽小程序隱藏');
},

 

頁面生命周期 xxx.js

Page({
  data:{
    },
  onLoad:function(options){
    // 生命周期函數--監聽頁面加載
    console.log("onLoad");
  },
  onReady:function(){
    // 生命周期函數--監聽頁面初次渲染完成
    console.log("onReady");
  },
  onShow:function(){
    // 生命周期函數--監聽頁面顯示
   console.log("onShow");
  },
  onHide:function(){
    // 生命周期函數--監聽頁面隱藏
     console.log("onHide");
  },
  onUnload:function(){
    // 生命周期函數--監聽頁面卸載
     console.log("onUnload");
  },
  onPullDownRefresh: function() {
    // 頁面相關事件處理函數--監聽用戶下拉動作
     console.log("onPullDownRefresh");
  },
  onReachBottom: function() {
    // 頁面上拉觸底事件的處理函數
     console.log("onReachBottom");
  },
   /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function () {
    
  }

})

 

 

1、小程序注冊完成后，加載頁面，觸發onLoad方法，一個頁面只會調用一次（剛加載時調用一次）；
2、頁面載入后觸發onShow方法，顯示頁面，每次打開頁面都會調用一次 （只要展示這個頁面，就會自動加載）；
3、首次顯示頁面，會觸發onReady方法，渲染頁面和樣式，一個頁面只會調用一次（剛加載時調用一次）；
4、當小程序后台運行或跳轉（wx.navigateTo）到其他頁面時，觸發onHide方法；
5、當小程序從后台進入前台運行或重新載入頁面時，觸發onShow方法；
6、當小程序使用wx.readirectTo()、關閉當前頁和返回上一頁wx.navigateBack(),會觸發onUnload

頁面調用棧

var pages = getCurrentPages();
prevPage = pages[pages.length-2];