1. 程式人生 > 實用技巧 >微信小程式 常用生命週期勾子onLoad onShow等解釋

微信小程式 常用生命週期勾子onLoad onShow等解釋

按官方文件解釋,onLoad() 應該在第一次顯示頁面的時候呼叫,以後再次切換到該頁面時,不會再呼叫這個函式。如下圖:

實際除錯中,進入一個頁面時,我發現頁面的 onLoad() 函式有時有呼叫,有時沒有。原因在下面的解釋中:

onLoad: 頁面載入。
一個頁面只會呼叫一次。
引數可以獲取wx.navigateTo和wx.redirectTo及中的 query。

onShow: 頁面顯示
每次開啟頁面都會呼叫一次。

onReady: 頁面初次渲染完成
一個頁面只會呼叫一次,代表頁面已經準備妥當,可以和檢視層進行互動。
對介面的設定如wx.setNavigationBarTitle請在onReady之後設定。詳見生命週期

onHide: 頁面隱藏
當navigateTo或底部tab切換時呼叫。

onUnload: 頁面解除安裝
當redirectTo或navigateBack的時候呼叫。

因此,只要是使用了 redirectTo() 或 navigateBack(),再次進入頁面就會呼叫 onLoad()。

舉個例子,內容詳情頁面,如果除了系統預設的左上角的 < 返回,沒有提供更多的操作,使用者每次離開詳情頁面唯有點選左上角的返回,必然呼叫 navigateBack(), 因此在這種情況下,使用者每次進入詳情頁面都要執行 onLoad()。

然後自己再BB總結一下
(1)onLoad
頁面載入時觸發,且只發生一次,有些資料實時性要求不高可以onlaod裡面觸發對應的請求

(2)onReady
頁面初次渲染之後觸發(只是初次,下一次頁面渲染就沒他什麼事),只觸發一次。你傳送請求其實也可以把它當做onload畢竟也只是一次,但是你涉及到一些渲染的東西要注意了,設定頁面標題之類的要在他之後再用。

(3)onShow
定義是頁面顯示,切入前臺觸發,用我的話來講就是這個頁面出現一次,他就被呼叫一次包括你前進後退到這個頁面。
(4)onHide
可能你看圖alive和active切換可能不太瞭解,但是你實際操作一下就知道,寫一個簡單得列印函式,在onHide裡面呼叫,切換頁面的時候你就會發現該函式被呼叫。你可以通過這個Hide的詞來理解,這個頁面切換到別的頁面就會觸發。

待續。。。。

實際使用注意
onload在頁面載入的時候載入一次,而onShow就是切換到這個頁面就會載入一次。所以很多操作尤其是有資料互動請求後臺的的function函式要注意,該放onload就放在onload裡面,該放在onShow就放在onShow裡面,別一個請求多次觸發然而沒什麼實際意義,減輕後臺壓力,查詢日誌也方便,不會有一大堆相同的無意義請求干擾。有些東西請求拿到資料可以放在快取裡,像有些資料時效性不是很高可以拿快取資料處理,時效性有點高的資料,可以定時一段時間重新整理請求一下,你如商品列表的商品,你onShow一次太頻繁,不更新的話新的商品上新前臺看不到,可以定時重新整理請求一次獲取資料。