• 路由方式
  • 頁面棧
  • getCurrentPages()
  • 路由方式

路由方式

頁面棧

框架以棧的形式維護(hù)了當(dāng)前的所有頁面。 當(dāng)發(fā)生路由切換的時候，頁面棧的表現(xiàn)如下：

創(chuàng)新互聯(lián)自2013年起，先為防城等服務(wù)建站，防城等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為防城企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

路由方式	頁面棧表現(xiàn)
初始化	新頁面入棧
打開新頁面	新頁面入棧
頁面重定向	當(dāng)前頁面出棧，新頁面入棧。
頁面返回	頁面不斷出棧，直到目標(biāo)返回頁。
Tab 切換	頁面全部出棧，只留下新的 Tab 頁面。

getCurrentPages()

getCurrentPages() 函數(shù)用于獲取當(dāng)前頁面棧的實(shí)例，以數(shù)組形式按棧的順序給出，第一個元素為首頁，最后一個元素為當(dāng)前頁面。

代碼示例

在開發(fā)者工具中打開

在開發(fā)者工具中打開

在 WEB IDE 中打開

頁面切換路徑過多，詳細(xì)示例請?jiān)陂_發(fā)者工具中的控制臺查看。

Tip：

不要嘗試修改頁面棧，會導(dǎo)致路由以及頁面狀態(tài)錯誤。

路由方式

對于路由的觸發(fā)方式以及頁面生命周期函數(shù)如下：

路由方式	觸發(fā)時機(jī)	路由前頁面	路由后頁面
初始化	智能小程序打開的第一個頁面		onLoad, onShow
打開新頁面	調(diào)用 API swan.navigateTo 或使用組件 < navigator open-type=”navigateTo”/ >	onHide	onLoad, onShow
頁面重定向	調(diào)用 API swan.redirectTo 或使用組件 < navigator open-type=”redirectTo”/ >	onUnload	onLoad, onShow
Tab 切換	調(diào)用 API swan.switchTab 或使用組件 < navigator open-type=”switchTab”/ > 或用戶切換 Tab		各種情況請參考下表
頁面返回	調(diào)用 API swan.navigateBack 或使用組件 < navigator open-type=”navigateBack”/ > 或用戶按左上角返回按鈕	onUnload	onShow
重啟動	調(diào)用 API swan.reLaunch 或使用組件 < navigator open-type=”reLaunch”/ >	onUnload	onLoad, onShow

同時點(diǎn)擊頁面重定向和重啟動跳轉(zhuǎn)到下一個頁面后無法返回。

Tab 切換對應(yīng)的生命周期（以 A、B 頁面為 Tabbar 頁面，C 是從 A 頁面打開的頁面，D 頁面是從 C 頁面打開的頁面為例）：

當(dāng)前頁面	路由后頁面	觸發(fā)的生命周期（按順序）
A	A	Nothing happend
A	B	A.onHide(), B.onLoad(), B.onShow()
A	B（再次打開）	A.onHide(), B.onShow()
C	A	C.onUnload(), A.onShow()
C	B	C.onUnload(), B.onLoad(), B.onShow()
D	B	D.onUnload(), C.onUnload(), B.onLoad(), B.onShow()
D（從轉(zhuǎn)發(fā)進(jìn)入）	A	D.onUnload(), A.onLoad(), A.onShow()
D（從轉(zhuǎn)發(fā)進(jìn)入）	B	D.onUnload(), B.onLoad(), B.onShow()

代碼示例

在開發(fā)者工具中打開

在開發(fā)者工具中打開

在 WEB IDE 中打開

建議在開發(fā)者工具中的控制臺查看，工具與真機(jī)略有差異，以真機(jī)的生命周期為準(zhǔn)。

說明：

• navigateTo、redirectTo 只能打開非 tabBar 頁面。
• switchTab 只能打開 tabBar 頁面。
• reLaunch 可以打開任意頁面。
• 頁面底部的 tabBar 由頁面決定，即只要是定義為 tabBar 的頁面，底部都有 tabBar 。
• reLaunch、redirectTo、navigateTo 可在需要跳轉(zhuǎn)的應(yīng)用內(nèi)頁面路徑后帶參數(shù)。參數(shù)與路徑之間使用 ? 分隔，參數(shù)鍵與參數(shù)值用 = 相連，不同參數(shù)用 & 分隔；如path?key=value&key2=value2，如果跳轉(zhuǎn)的頁面路徑是 tabBar 頁面則不能帶參數(shù)。
• 調(diào)用頁面路由帶的參數(shù)可以在目標(biāo)頁面的 onLoad、onShow 中獲取，具體獲取方法見下方代碼示例。

代碼示例

• JS

 
 
 

  
  
  
// 目標(biāo)頁面
  
  
  
Page({
  
  
  
 // 在 onLoad 中獲取
  
  
  
 onLoad: function (options) {
  
  
  
 console.log(options);
  
  
  
 },
  
  
  
 // 在 onShow 中獲取
  
  
  
 onShow: function() {
  
  
  
 // 獲取當(dāng)前小程序的頁面棧
  
  
  
 let pages = getCurrentPages();
  
  
  
 // 數(shù)組中索引最大的頁面--當(dāng)前頁面
  
  
  
 let currentPage = pages[pages.length - 1];
  
  
  
 // 打印出當(dāng)前頁面中的 options
  
  
  
 console.log(currentPage.options);
  
  
  
 }
  
  
  
});
 
 
 

當(dāng)前題目：創(chuàng)新互聯(lián)百度小程序教程：路由方式
本文路徑：http://uogjgqi.cn/article/dpcjdso.html