一、生命周期

概念

生命周期（Life Cycle）是指一個對象從創(chuàng)建-->運行-->銷毀的整個階段

小程序的生命周期

• 小程序啟動，表示生命周期的開始
• 小程序關閉。表示生命周期的結束
• 中間小程序的整個運行過程就是小程序的生命周期

分類

應用生命周期

特指小程序從啟動-->運行-->銷毀的過程

頁面生命周期

特指小程序中每個頁面的加載-->渲染-->銷毀的整個過程

自定義組件生命周期

• 組件實例被創(chuàng)建
• 組件完全初始化完畢
• 組件進入頁面節(jié)點樹
• 組件離開頁面節(jié)點樹

其中，頁面的生命周期范圍較小，應用程序的生命周期范圍較大，如圖：

二、生命周期函數

概念

是由小程序框架提供的內置函數 ，會伴隨著生命周期，自動按次序執(zhí)行

作用

允許程序員在特定的時間點，執(zhí)行某些特定的操作

分類

1）小程序應用生命周期函數

伴隨著小程序的整個生命周期：啟動-->運行-->銷毀

需要在app.js文件中進行聲明，示例代碼如下：

App({
    //小程序初始化完成會執(zhí)行onLaunch，全局只會觸發(fā)一次，用于頁面初始化相關工作
    onLaunch:function(options){ },
    //小程序啟動時或者從后臺進入前臺顯示時觸發(fā)onShow
    onShow:function(options){ },
    //小程序從前臺進入后臺時觸發(fā)onHide
    onHide:function(options){ }
})

2）小程序頁面生命周期函數

伴隨著小程序頁面的整個生命周期：加載-->渲染-->銷毀

需要在頁面.js文件中進行聲明，示例代碼如下：

Page({
    onLoad:function(options){ },//監(jiān)聽頁面的加載，只會調用一次
    onShow:function(options){ },//監(jiān)聽頁面顯示
    onReady:function(options){ },//監(jiān)聽頁面初次渲染完成，只會調用一次
    onHide:function(options){ },//監(jiān)聽頁面隱藏
    onUnload:function(options){ },//監(jiān)聽頁面卸載，只會調用一次
})

3）小程序自定義組件的生命周期函數

分別是created、attached、detached函數

第一，當組件實例剛被創(chuàng)建完成，觸發(fā)created函數

• 但此時還不能調用setData函數
• 在這時間點，只用于給組件的this添加一些自定義的屬性字段

第二，當組件完全初始化完畢進入頁面節(jié)點樹，觸發(fā)attached函數

• 此時，this.data已經被初始化完畢
• 最為關鍵的生命周期，可以進行大多數初始化的工作，例如發(fā)送網絡請求獲取頁面的初始數據

第三，當組件離開頁面節(jié)點樹后，觸發(fā)detached函數

• 退出一個頁面時，會觸發(fā)頁面內每個自定義組件的detached函數
• 此時適合做一些清理性質的收尾工作

組件全部的生命周期函數如下：

4）定義組件的生命周期函數

在小程序組件中，組件的生命周期函數的定義有新舊兩種方式

• 第一種，直接定義在Component構造器內與data節(jié)點平級的第一級參數中
• 第二種，可以在lifetimes字段內進行聲明（推薦，其優(yōu)先級最高，且專門放生命周期函數）

自定義組件.js文件

//定義組件生命周期函數的兩種方式
Component({
     //推薦用法
     lifetimes:{
         attached(){ },
         detached(){ },
      }
     //舊的定義方式，與data節(jié)點平級
      attached(){ },
      detached(){ },
})

注：如果同時存在兩種新舊定義方式，那么舊的定義方式將會被覆蓋掉

三、總結

• 生命周期強調的是一個時間段，一個過程
• 生命周期函數強調的是某個時間點，是過程中的某個節(jié)點
• 注意區(qū)別不同類別的生命周期函數，不能搞混淆

到此這篇關于微信小程序中的生命周期與生命周期函數淺析介紹的文章就介紹到這了,更多相關小程序生命周期內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

最新評論