微信小程式navigateTo和redirectTo交替使用報錯navigateTo:fail webview count limit exceed

navigateTo:fail webview count limit exceed

• 前言
• 步驟
• 代碼
• 報錯原因
• 建議

前言

小程式的頭部預設使用

wx.navigateBack

關閉目前頁面，傳回上一頁面或多級頁面。然後在自定義小程式頭部後，傳回按鈕可以調用其他API。當

wx.navigateTo

和

wx.redirectTo

交替反複使用時，報錯

navigateTo:fail webview count limit exceed

。

您可以點選小程式代碼片段 minicode-27

步驟

在小程式用 a 頁面使用

wx.navigateTo

跳轉到 b 頁面，然後在 b 頁面使用

wx.redirectTo

傳回 a 頁面。如此交替切換頁面，最終頁面棧超過 10 個，頁面報錯

navigateTo:fail webview count limit exceed

。

代碼

• 首頁

// index.js
Page({
  onNavigateTo () {
    console.warn('通過 navigateTo 進入 redirectPage 頁面');
    wx.navigateTo({
      url: '/redirectPage/redirectPage'
    })
  },
  onShow () {
    const pages = [...getCurrentPages()]
    console.log('index頁面中，頁面棧總數', pages.length, pages)
  },
})
           

<!-- index.wxml -->
<button type="primary" bindtap="onNavigateTo">通過 navigateTo 進入 redirectPage 頁面</button>
           

• redirectPage頁面

// redirectPage.js
Component({
  pageLifetimes: {
    show: function () {
      const pages = [...getCurrentPages()]
      console.log('redirectPage頁面中，頁面棧總數', pages.length, pages)
    },
  },
  methods: {
    toIndex () {
      console.warn('通過 redirectTo 傳回 首頁');
      wx.redirectTo({
        url: '/index/index'
      })
    }
  },
})
           

<!-- redirectPage.wxml -->
<view>
  redirectPage頁面
</view>
<button type="primary" bindtap="toIndex">傳回首頁</button>
           

報錯原因

wx.navigateTo 保留目前頁面，跳轉到應用内的某個頁面。

wx.redirectTo 關閉目前頁面，跳轉到應用内的某個頁面。

• 初始化：第一次打開首頁，頁面棧為 1，隻包含首頁。
• 步驟1：從首頁

  navigateTo

  到 redirectPage頁面，頁面棧為2。
• 步驟2：再從 redirectPage頁面，通過

  redirectTo

  傳回首頁，頁面棧為2。
• 重複步驟1 和步驟2。

• …

  最後頁面棧有10層，已經無法跳轉頁面，并且報錯

  navigateTo:fail webview count limit exceed

  。

建議

• wx.navigateTo

  配合

  wx.navigateBack

  使用
• 小程式從 a 頁面 -> b 頁面 -> c 頁面 -> d -> 頁面 -> e 頁面 -> f 頁面等，頁面層級較深時，當頁面 d既可以傳回頁面 a，又可以傳回頁面 c時。傳回頁面 c用

  wx.navigateBack

  ，傳回頁面 a使用

  wx.reLaunch

  更佳，關閉所有頁面，打開到應用内的某個頁面。
• 頁面無需保留，跳轉到一個新頁面時，使用

  redirectTo