解決vue路由跳轉報錯，Navigation cancelled ……to with a new navigation

vue跳轉路由報錯：

解決 Uncaught (in promise) Error: Navigation cancelled from “/Search#1608911018888” to “/Search#1608911019245” with a new navigation.

 

 

1、報錯原因：

這個錯誤是vue-router內部錯誤,沒有進行catch處理,導致的編程式導航跳轉問題,往同一地址跳轉時會報錯的情況。

在升級了Vue-Router版本到到3.1.0及以上之后，頁面在跳轉路由控制台會報Uncaught (in promise)的問題，在3.1.0版本里面新增功能：push和replace方法會返回一個promise, 你可能在控制台看到未捕獲的異常。

 

// push
VueRouter.prototype.push = function push (location, onResolve, onReject) {
  // if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
  return originalPush.call(this, location).catch(err => {return;})
}
// replace
VueRouter.prototype.replace = function replace (location, onResolve, onReject) {
  // if (onResolve || onReject) return originalReplace.call(this, location, onResolve, onReject)
  return originalReplace.call(this, location).catch(err => err)
}