小程序模板網(wǎng)

小程序頁(yè)面跳轉(zhuǎn)解析

發(fā)布時(shí)間:2018-01-03 09:54 所屬欄目:小程序開(kāi)發(fā)教程

直接跳轉(zhuǎn):wx.navigateTo() 直接跳轉(zhuǎn):wx.navigateTo() 清空頁(yè)面棧再跳轉(zhuǎn):wx.reLaunch() 跳轉(zhuǎn)至 Tab Bar 頁(yè)面:wx.switchTab()

 
 
 

對(duì)于兩個(gè)或更多頁(yè)面的微信小程序而言,頁(yè)面之間的跳轉(zhuǎn)是在所難免的。

有關(guān)小程序頁(yè)面間跳轉(zhuǎn)的 API 函數(shù),微信一共為我們提供了 4 個(gè)(另外,還有返回上一級(jí)或多級(jí)的 wx.navigateBack)。

下面,我將主要圍繞這四個(gè) API 函數(shù),教你如何跳出頁(yè)面跳轉(zhuǎn)的大坑。

四個(gè)接口怎么用?

這四個(gè) API 可接受的參數(shù)都是完全相同的,如下:

在小程序 JavaScript 邏輯代碼中的用法,也完全相同,具體語(yǔ)法為:

函數(shù)名({
  url: "",
  success: function () {},
  fail: ...,
  complete: ...
})

雖然它們有這么多的相同點(diǎn),但它們絕對(duì)一點(diǎn)都不多余, 因?yàn)樗鼈兊挠梅ㄍ耆鞑幌嗤?/p>

直接跳轉(zhuǎn):wx.navigateTo()

wx.navigateTo() 用于保留當(dāng)前頁(yè)面、跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面,使用 wx.navigateBack 可以返回到原頁(yè)面。

對(duì)于頁(yè)面不是特別多的小程序,通常推薦使用 wx.navigateTo 進(jìn)行跳轉(zhuǎn), 以便返回原頁(yè)面,以提高加載速度。當(dāng)頁(yè)面特別多時(shí),則不推薦使用。

重定向:wx.redirectTo()

當(dāng)頁(yè)面過(guò)多時(shí),被保留頁(yè)面會(huì)擠占微信分配給小程序的內(nèi)存,或是達(dá)到微信所限制的 5 層頁(yè)面棧。這時(shí),我們應(yīng)該考慮選擇 wx.redirectTo。

wx.redirectTo() 用于關(guān)閉當(dāng)前頁(yè)面,跳轉(zhuǎn)到應(yīng)用內(nèi)的某個(gè)頁(yè)面。這樣的跳轉(zhuǎn),可以避免跳轉(zhuǎn)前頁(yè)面占據(jù)運(yùn)行內(nèi)存,但返回時(shí)頁(yè)面需要重新加載,增加了返回頁(yè)面的顯示時(shí)間。

清空頁(yè)面棧再跳轉(zhuǎn):wx.reLaunch()

wx.reLaunch() 與 wx.redirectTo() 的用途基本相同, 只是 wx.reLaunch() 先關(guān)閉了內(nèi)存中所有保留的頁(yè)面,再跳轉(zhuǎn)到目標(biāo)頁(yè)面。

跳轉(zhuǎn)至 Tab Bar 頁(yè)面:wx.switchTab()

對(duì)于跳轉(zhuǎn)到 tab bar 的頁(yè)面,最好選擇 wx.switchTab(),它會(huì)先關(guān)閉所有非 tab bar 的頁(yè)面。

其次,也可以選擇 wx.reLaunch(),它也能實(shí)現(xiàn)從非 tab bar 跳轉(zhuǎn)到 tab bar,或在 tab bar 間跳轉(zhuǎn),效果等同 wx.switchTab()。

使用其他跳轉(zhuǎn) API 來(lái)跳轉(zhuǎn)到 tab bar,則會(huì)跳轉(zhuǎn)失敗。tab bar 如下所示(位于小程序底部):

 

關(guān)閉頁(yè)面:wx.navigateBack()

wx.navigateBack() 用于關(guān)閉當(dāng)前頁(yè)面,并返回上一頁(yè)面或多級(jí)頁(yè)面。開(kāi)發(fā)者可通過(guò) getCurrentPages() 獲取當(dāng)前的頁(yè)面棧,決定需要返回幾層。

這個(gè) API 需要填寫(xiě)的參數(shù)只有 delta,表示要返回的頁(yè)面數(shù)。若 delta 的取值大于現(xiàn)有可返回頁(yè)面數(shù)時(shí),則返回到用戶(hù)進(jìn)入小程序的第一個(gè)頁(yè)面。

當(dāng)不填寫(xiě) delta 的值時(shí),就默認(rèn)其為 1(注意,默認(rèn)并非取 0),即返回上一頁(yè)面。



易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開(kāi)源 碼云倉(cāng)庫(kù):starfork
本文地址:http://22321a.com/wxmini/doc/course/18366.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢(xún):800182392 點(diǎn)擊咨詢(xún)
QQ在線(xiàn)咨詢(xún)