NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated"}問題

Uncaught (in promise)NavigationDuplicated{_name:“NavigationDuplicated”}

最近在vue項目中遇到個問題——點擊側邊欄路由跳轉時在控制檯報錯，如下圖所示：

vue-router 3以上版本回調形式改成promise api的形式了，返回的是一個promise，3.0以下版本則不會出現上面的警告⚠️。

解決方案如下：

• 方案1

  在main.js中加入如下代碼:

  import Router from 'vue-router'
  const routerPush = Router.prototype.push
  Router.prototype.push = function push(location) {
    return routerPush.call(this, location).catch(error=> error)
  }
  

• 方案2

  安裝vue-router版本

  npm i vue-router@3.0 -S