Vue-router 报NavigationDuplicated的可能解决方案

最新推荐文章于 2024-04-24 14:52:25 发布
最新推荐文章于 2024-04-24 14:52:25 发布
阅读量108 收藏
点赞数
文章标签： Vue.js 错误处理 vue vue-router
原文链接：https://www.codeprj.com/blog/b0a7ea1.html
版权
asdfgh0077
关注
Vue-router 报错NavigationDuplicated的解决方法
11-21
版本：3.1.x 报错原因： 使用push()、replace()进行导航时，不能重复导航到当前路由。 解决办法： 方法1：在定义路由的文件中router/index.js const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function push (location) { return originalPush.call(this, location).catch(err => err) } const originalReplace = VueRouter.prototype.rep
Vue-router 报NavigationDuplicated解决方案
Cooky的博客
02-18 927
原因：Vue-router在3.1之后把$router.push()方法改为了Promise, 所以当你使用router.push的时候，按照旧写法没有写回调函数，则会抛出一个uncaught (in promise)的错误，交由全局错误处理则会直接打印报错，解决方法是在调用router.push的时候增加回调函数，如： router.push('/location').catch(err =&...
关于Vue中的NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated"}
迈向前端攻城狮的路上
09-10 6700
在使用Element UI 时点击同一个路由，页面报错 解决方法如下： 在引用vue-router的文件中添加一段代码 const originalPush = Router.prototype.push; Router.prototype.push = function push(location) { return originalPush.call(this, location)....
Vue报错：NavigationDuplicated: Avoided redundant navigation to current location（提示这是到当前位置的冗余导航）
weixin_47339511的博客
03-02 824
今天在做电影app时，需求是：有一个长列表，当我们滑动后，进入了另外一个页面之后在返回列表页时，会依旧保持我们第一次滑动的位置。看图： 解决方法： 在router.js（由于配置不同，或许有些人需写在router/index.js）中写入以下代码： import Router from 'vue-router'; const originalPush = Router.prototype.push Router.prototype.push = function push(location) {
Vue-Router路由path相同警告，不允许导航到相同路由，报错“NavigationDuplicated: Avoided redundant navigation to current loc
Sodaxiang的博客
11-28 1363
Vue-Router路由path相同警告，不允许导航到相同路由，报错"NavigationDuplicated: Avoided redundant navigation to current location: " 报错提示：避免重复路由； 原因：在页面上重复进入了相同的路由； 解决：主要有3种方案，如下（对于repalce方法也同样适用）： 直接在路由跳转的部分加上'.catch(()=>{})'，这可以避免显示错误，因为浏览器认为异常已被处理。 在定义路由时候加上全局捕获.
vue-router.js:2071 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to curre
年少不知曲中意,再听已是曲终人
04-30 397
vue-router.js:2071 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/register".
vue-router 采坑记录
Q1761991696的专栏
10-12 2463
一、错误：Uncaught Error: [vue-router] route config "component" for path: /detail cannot be a string id. Use an actual component instead. 解决方案：路由配置中 import Detail from './components/detail.vue'; const routers = [ ...... { path:'/detail', ...
关于产生冗余导航，vue-router报错的问题
weixin_43786395的博客
02-16 1092
项目场景： 写编程式路由导航时，vue-router报错。 问题描述： Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/home/message/detail?id=003&title=%E6%B6%88%E6%81%AF003". at createRouterError (webpack-internal:///./node_modules/
解决vue-router跳转重复路径报错问题
weixin_45932733的博客
12-02 3040
在最近写代码时发现，我的路由跳转重复路径后，报错如下,问题可能是官方当前版本问题，所以解决方案如下 let path = this.$route.path let newpath = "/home" if (path ==!newpath) { this.$router.push(newpath) } Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/home".
Vue路由NavigationDuplicated错误
最新发布
c_studer_的博客
04-24 1878
这个错误信息显示的是错误，也就是说，在 Vue.js 使用 vue-router 时，应用试图导航到一个与当前已经是激活状态的路由相同的新路由上，从而触发了这个错误。在实际应用中，这通常发生在你试图通过vue-router的push或者replace方法重复跳转到相同的路由地址上。
VUE解决路由跳转时的NavigationDuplicated错误
DLwl7798的博客
03-10 400
问题: 编程式路由跳转到当前路径且参数没有变化时会抛出 NavigationDuplicated 错误 原因分析:
解决vue项目Vue-router 报NavigationDuplicated: "Navigating to current location ("") is not allowed"的问题
weixin_44727491的博客
04-02 5669
出现问题的原因 其原因在于Vue-router在3.1之后把$router.push()方法改为了Promise。所以假如没有回调函数，错误信息就会交给全局的路由错误处理，因此就会报上述的错误。 vue-router是先报了一个Uncaught (in promise)的错误(push没加回调)，然后报NavigationDuplicated的错误(路由出现的错误，全局错误处理打印了出来。 解决方...
vue项目 NavigationDuplicated 错误
cmmboy1990的博客
07-21 197
NavigationDuplicated: Avoided redundant navigation to current location… 1.原因：element-ui多次点击导航（多次push同一个路由），会报错 2.解决：在router index,js 中加入代码： const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function push(location) { return origina
Vue-router 报NavigationDuplicated 的问题解决
dreamy_wx的博客
12-23 436
出现这个原因在于Vue-router在3.1之后把$router.push()方法改为了Promise。 所以当没有回调函数的时候，错误信息就会交给全局的路由错误处理，因此就 会报上述的错误。即使出现了这个错误，对我们的界面渲染也没什么影响， 强迫症一点就可以采用下面代码直接复制过去或者降版本~~~ 路由跳转可能使用$router.push()方法或 $router.replace() //解决编程式路由往同一地址跳转时会报错的情况 import Vue from "vue" import VueR.
vue路由切换时NavigationDuplicated报错的解决方法
xm2by的博客
01-16 1554
vue路由切换时NavigationDuplicated报错的解决方法 在vue中使用this.$router.push()方法切换路由时，有时控制台会报NavigationDuplicated相关的错误，如下图所示： 原因： 在网上查询一番后，比较多的一种说法是，vue-router在3.1之后把$router.push()方法改为了Promise，因此在使用$router.push()时如果...
Vue - 报错Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location
王佳斌
11-16 1954
vue2，vue2报错，浏览器控制台报错，vue2网页网站路由报错，vue中出现路由导航出现Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "xxx"，vue重复点击菜单报错怎么办，vue路由报错如何解决，vue怎么解决重复点击路由报错问题，解决Vue路由导航报错:NavigationDuplicated，成功解决，Vue路由导航报错，Vue - 报错Uncaught
已解决vue-router报NavigationDuplicated: Avoided redundant navigation to current location 的问题
热门推荐
小威的博客
04-22 1万+
前几天在朋友的项目报了如标题所示的错误，之前我也遇到过，所有写此篇文章记录一下。在Vue.js项目中，使用vue-router进行路由管理时，有时会遇到的警告信息。这个警告通常发生在尝试导航到当前已经激活的路由时，vue-router为了避免不必要的导航操作而发出的。虽然这通常不会影响到应用的正常功能，但过多的冗余导航可能会引发性能问题或者调试上的困扰。
vue 路由 NavigationDupLicated 解决
weixin_45802907的博客
12-08 826
vue 路由 NavigationDupLicated 解决 编程式路由跳转到当前路由(参数不变)，多次执行会抛出 NavigationDupLicated 的警告错误。怎么解决 为什么编程式导航进行路由跳转的时候，就会有这种警告错误呢 因为 vue-router:3.5.3 版本引入了 promise，假如没有回调函数，错误信息就会交给全局的路由错误处理，因此就会报上述的错误。 解决方法 方法一 运用编程式路由的时候加上成功，失败的回调 this.$router.push( { name: "
Vue-router 报NavigationDuplicated的可能解决方案，工作感悟
2401_84139908的博客
04-11 839
前端字节跳动真题解析一个人可以走的很快，但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎扫码加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！场吐槽、大厂内推、面试辅导），让我们一起学习成长！**[外链图片转存中…(img-8qVRKEpf-1712773636251)]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值