在小程序中每個頁面可以看成是一個pageModel,pageModel全部以棧的形式進行管理(最多五層)
在說跳轉方式之前我們先來溫習一下棧和堆的區別
管理方式不同
棧是系統編譯器啟動管理,不需要程序員手動管理
堆的釋放由程序員手動管理,不及時回收容易產生內存泄露
分配方式不同
棧有兩種分配方式:靜態分配和動態分配
靜態分配是系統編譯器完成的,比如局部變量的分配
動態分配是由alloc函數進行分配的,但是棧的動態分配和堆的動態分配是不同的,它的動態分配也由系統編譯器進行釋放,不需要程序員手動管理
堆是動態分配和回收內存的,沒有靜態分配的堆
分配大小不同
棧是向低地址擴展的數據結構,是一塊連續的內存區域
堆是向高地址擴展的數據結構,是不連續的內存區域
小程序的路由跳轉分為兩種,組件跳轉以及api跳轉
api形式分為
navigateTo 保留當前頁面,跳轉到應用內的某個頁面,使用wx.navigateBack可以返回到原頁面
redirectTo 關閉當前頁面,跳轉到應用內的某個頁面
switchTab 跳轉到tabBar頁面,同時關閉其他非tabBar頁面
navigateBack 返回上一頁面
reLanch 關閉所有頁面,打開到應用內的某個頁面
前面有提到棧,那么這些導航方式跟棧有什么關系呢,看下面
初始化 新頁面入棧
navigateTo 新頁面入棧
redirectTo 當前頁面出棧,新頁面入棧
navigateBack 頁面不斷出棧,直到目標返回頁,新頁面入棧
switchTab 頁面全部出棧,只留下新的 Tab 頁面
reLanch 頁面全部出棧,只留下新的頁面
通過組件形式進行跳轉
// navigator 組件默認的 open-type 為 navigate
跳轉到新頁面
// 如需要其它形式進行跳轉,可以更改open-type 屬性以上api值
切換 Tab
getCurrentPages
getCurrentPages() 函數用于獲取當前頁面棧的實例(屬性及方法),以數組形式按棧的順序給出,第一個元素為首頁,最后一個元素為當前頁面
// Page A 跳轉至Page B
wx.navigateTo({ url: '/pages/B/B' })
// Page B
const pages = getCurrentPages()
const perPage = pages[pages.length - 2] // 上一個頁面
perPage.setData({
title: 'JS每日一題'
})
總結
小程序頁面由棧形式管理,最多為5層,在合理的場景使用合理的方式進行跳轉
小程序