微信小程式wx.navigateTo從子頁面跳回父頁面，頁面如何重新整理

要了解微信小程式的頁面重新整理問題,首先需要了解頁面的生命周期,是以以下兩個頁面必須多看幾遍 頁面生命周期 頁面路由 關于

,重點在于了解onLoad,onShow.

從以上的第一個連結文檔可以看到,頁面create後,依次執行onLoad,onShow,onReady,但onLoad和onReady每個頁面生命周期隻會觸發一次，如果一個頁面沒有onUnload(也就是沒有銷毀并end了)，則不會再次觸發onLoad和onReady.

onShow則不同,頁面隻要onHide後,再次進入就會觸發onShow,并且請注意,如果Send Data,頁面就會Rerender. 也就是說,我們如果能在onShow()裡擷取到改變後的資料,頁面就會重新渲染(重新整理).

在

這個連結文檔裡,重點看"路由方式"那張表,如下圖,wx.navigateTo到子頁面後,父頁面是onHide了,

當我們按左上角傳回按鈕,或者調用wx.navigateBack傳回到父頁面時,父頁面調用了onShow()

了解了以上的内容,傳回父頁面并重新整理的問題就很簡單了.思路如下:

1. 使用vuex或者資料緩存定義一個全局變量,比如wx.setStorageSync('isRerender','false')；
2. 在父頁面的onShow()鈎子函數裡檢測這個變量,如果有變化,那麼設定相關的初始狀态後,則再次執行擷取資料的的方法,并且設定wx.setStorageSync('isRerender','false')；
3. 子頁面如果修改了資料，那麼就wx.setStorageSync('isRerender','true')。