Vue-Router 路由重复点击时报错 Uncaught (in promise) NavigationDuplicated:Avoided redundant navigation to curr

前言

总结一下，在项目中遇到的一个小问题，使用 Vue 构件的项目里，有时候会存在重复点击路由报错的问题，Uncaught (in promise) NavigationDuplicated:Avoided redundant navigation to current location

虽然这个报错并不影响程序的正常运行，但是依然让人感到很不爽，这段代码也差不多是我在构建项目时用的挺多的一段代码。

而且，应该也有很多萌新遇到过这个问题，但是不知道如何解决，所以在这边记录一下。

造成这个报错的原因，大多是说因为 Vue-Router 版本的原因，但是我尝试更换了不同版本，但是依然没有得到缓解，还是这段代码好使！

解决方法

在 router/index.js 文件中添加一段代码即可：

// 解决重复点击路由报错的BUG
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {return originalPush.call(this, location).catch((err) => err)
}

当然你也可以加在 mian.js 中，我更加习惯于添加在 router/index.js。

Vue-Router 路由重复点击时报错 Uncaught (in promise) NavigationDuplicated:Avoided redundant navigation to curr相关推荐

vue报错Uncaught (in promise) NavigationDuplicated:Avoided redundant navigation
vue-router.esm.js?3423:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation ...
Vue的router导航重复-报错：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to curren
报错: Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: &q ...
解决Vue报错：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location
问题描述:重复点击导航时,控制台出现报错 ,虽然不影响功能使用,但也不能坐视不管. 解决 Vue 重复点击相同路由,出现 Uncaught (in promise) NavigationDuplica ...
解决报错：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: “
报错内容: vue-router.esm.js?68cf:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navi ...
解决 Vue 重复点击相同路由，出现 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation 问题
问题描述:重复点击导航时,控制台出现报错 ,虽然不影响功能使用,但也不能视而不见. 解决方案: 方案一:只需在 router 文件夹下,添加如下代码: // src/router/index.js V ...
报错 | vue-router.esm.js?3423:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navig
vue-router.esm.js?3423:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation ...
VUE router 导航重复点击报错的问题解决两种方案
VUE router 导航重复点击报错的问题解决两种方案前几天一个月薪35k的兄弟,给我推了一个人工智能学习网站,看了一段时间挺有意思的.包括语音识别.机器翻译等从基础到实战都有,很详细,分享给大家 ...
vue-router路由重复点击时报错的解决方案
1.报错 2.解决方法在router文件的index.js中添加如下代码: // 注:VueRouter就是文件中引入的路由对象 // Handle navigation duplication e ...
vue 菜单路由重复点击报错
解决方法: 在当前页面添加: import Router from 'vue-router' const originalPush = Router.prototype.push; Router.pr ...

Vue-Router 路由重复点击时报错 Uncaught (in promise) NavigationDuplicated:Avoided redundant navigation to curr

前言

解决方法

Vue-Router 路由重复点击时报错 Uncaught (in promise) NavigationDuplicated:Avoided redundant navigation to curr相关推荐

最新文章

热门文章