Vue-router 报NavigationDuplicated
Author：zhoulujun Date：
vue-router升级到3.0后的版本，比如我用的版本："vue-router": "^3.0.2",
使用vue-router进行路由跳转，跳转相同路径，两次或以上，就会报错
因在于Vue-router在3.1之后把$router.push()方法改为了Promise。所以假如没有回调函数，错误信息就会交给全局的路由错误处理，因此就会报上述的错误。
如果你仔细观察并复现了多次错误你会发现，vue-router是先报了一个Uncaught (in promise)的错误(因为push没加回调)，然后再点击路由的时候才会触发NavigationDuplicated的错误(路由出现的错误，全局错误处理打印了出来)。
修改vue-router版本
只有手动降级到 3.0
npm i [email protected]
我是选中升级包
npm view vue-router versions --json npm i [email protected]
第二种解决办法就是
禁止全局路由错误处理打印
这个也是vue-router开发者给出的解决方案：
import Router from 'vue-router'
const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}vue-router的开发者也给出了解决方法，你需要为每个router.push增加回调函数。
router.push('/location').catch(err => {err})参考文章：
vue router 报错： Uncaught (in promise) NavigationDuplicated {_name:""NavigationDuplicated"... 的解决方法
Vue-router 报NavigationDuplicated的可能解决方案
转载本站文章《Vue-router 报NavigationDuplicated》,
请注明出处：https://www.zhoulujun.cn/html/webfront/ECMAScript/vue/8394.html