vue3.0vue-router在3.0版本以上element ui导航栏重复点击报错解决办法

Vue.js 项目控制台报错：

 

Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/user/student".

问题原因：多次点击跳转同一路由是不被允许的（版本原因）

 

解决方案：

方案一、切换版本回到3.0

使用npm运行的切换版本命令

npm i vue-router@3.0 -S #npm命令

使用yarn运行的切换版本命令

yarn add vue-router@3.0 #yarn命令

注意：如果执行后，运行项目报错，则关闭项目网页再重新执行运行项目命令。

 

方案二、重写规则

在引入vue-route的js文件（在包含这句代码 Vue.use(Router) 的文件）加上如下代码即可

//push 
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}

 两种方法都可以解决报错的问题。

如有帮助，点个赞吧