本文實(shí)例講述了微信小程序出現(xiàn)wx.navigateTo頁(yè)面不跳轉(zhuǎn)問(wèn)題的解決方法。分享給大家供大家參考，具體如下：

今天在做微信小程序的時(shí)候，做的商品購(gòu)買流程。流程是這樣的：

商品展示-->商品詳情-->下單頁(yè)面-->下單詳情頁(yè)面-->支付結(jié)果頁(yè)面-->跳轉(zhuǎn)訂單詳情頁(yè)面。

但是在支付成功之后，點(diǎn)擊按鈕跳轉(zhuǎn)，發(fā)現(xiàn)怎么也跳轉(zhuǎn)不了到訂單詳情頁(yè)面，前后log都能打印出來(lái)，證明已經(jīng)執(zhí)行了wx.navigateTo方法，但是跳轉(zhuǎn)不成功，而且，坑爹的是也不報(bào)錯(cuò)。

翻看微信小程序開(kāi)發(fā)文檔，參考鏈接：

https://mp.weixin.qq.com/debug/wxadoc/dev/api/ui-navigate.html#wxnavigatetoobject

其中有一行提到：

就是這一句：“注意：為了不讓用戶在使用小程序時(shí)造成困擾，我們規(guī)定頁(yè)面路徑只能是五層，請(qǐng)盡量避免多層級(jí)的交互方式。”數(shù)一數(shù)我的跳轉(zhuǎn)頁(yè)面，當(dāng)然你可以可以看微信開(kāi)發(fā)者工作的預(yù)覽視圖右上角，會(huì)出現(xiàn)您當(dāng)前調(diào)試的頁(yè)面有5個(gè)這樣的提示。

再貼一下我的頁(yè)面跳轉(zhuǎn)情況：

① 商品展示-->② 商品詳情-->③ 下單頁(yè)面-->④ 下單詳情頁(yè)面-->⑤ 支付結(jié)果頁(yè)面-->⑥ 跳轉(zhuǎn)訂單詳情頁(yè)面。

就在最后一步的時(shí)候已經(jīng)跳轉(zhuǎn)不過(guò)去了，此時(shí)前面已經(jīng)使用wx.navigateTo跳轉(zhuǎn)了五個(gè)頁(yè)面，剛好達(dá)到限制。

然后我試著在下單頁(yè)面跳轉(zhuǎn)到下單詳情頁(yè)面的時(shí)候換用：wx.redirectTo()方法跳轉(zhuǎn)，然后再編譯執(zhí)行，發(fā)現(xiàn)跳轉(zhuǎn)到訂單詳情頁(yè)面成功。然后我把一些不需要返回之后還回到當(dāng)前頁(yè)面的跳轉(zhuǎn)換成了wx.redirectTo()來(lái)跳轉(zhuǎn)，解決了wx.navigateTo跳轉(zhuǎn)不成功的問(wèn)題。

wx.redirectTo()方法，是打開(kāi)新的頁(yè)面，并關(guān)閉當(dāng)前的頁(yè)面。這個(gè)理解起來(lái)可以使用android的啟動(dòng)模式來(lái)理解。就像一個(gè)水桶，可以說(shuō)一個(gè)棧，這個(gè)桶只能裝得下5個(gè)西瓜，本來(lái)水桶是沒(méi)有西瓜的，然后我們打開(kāi)一個(gè)頁(yè)面使用wx.navigateTo方法啟動(dòng)的時(shí)候，就往水桶里邊扔一個(gè)西瓜，這樣五個(gè)滿了之后，再打開(kāi)新的頁(yè)面，再往水桶里邊扔西瓜，那肯定是裝不下的了。如果我們使用的是wx.redirectTo()，當(dāng)我們打開(kāi)一個(gè)新頁(yè)面時(shí)，也會(huì)往桶里扔一個(gè)西瓜，然后會(huì)把當(dāng)前的這個(gè)在桶里的西瓜，吃掉，這樣就留出了空間。

所以，在微信小程序頁(yè)面跳轉(zhuǎn)中，如果當(dāng)前的頁(yè)面，在跳轉(zhuǎn)之后是不必要的，沒(méi)有返回到這個(gè)頁(yè)面的需求的時(shí)候，盡量使用wx.redirectTo()來(lái)跳轉(zhuǎn)打開(kāi)新的頁(yè)面，避免出現(xiàn)上述的問(wèn)題。

希望本文所述對(duì)大家微信小程序開(kāi)發(fā)有所幫助。

最新評(píng)論