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

今天在做微信小程序的時候，做的商品購買流程。流程是這樣的：

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

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

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

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

其中有一行提到：

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

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

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

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

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

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

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

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

最新評論