Vue中重复点击导航栏浏览器Console报错：Avoided redundant navigation to current location

最新推荐文章于 2024-05-09 16:10:48 发布
最新推荐文章于 2024-05-09 16:10:48 发布
阅读量206 收藏
点赞数
分类专栏： 错误集 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yunwuguiqi/article/details/108202492
版权

在使用Vue-elementUI的过程中发现在浏览器的console中有这样的错误：Error：Avoided redundant navigation to current location: "/xxxxxx"

原因：对当前导航栏的重复点击导致的

解决办法：在vue项目下找到router目录，在index.js中添加以下代码

 

 

 

 

小@菜白
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: “/sear
dw将限制条件全部检测通过后才能提交表单
11-24 439
处理搜索按钮按下两次及以上的报错问题
Vue项目中控制台报错：NavigationDuplicated: Avoided redundant navigation to current location......解决办法
DangR_Jisoo的博客
03-07 1122
Vue项目中控制台报错：NavigationDuplicated: Avoided redundant navigation to current location…解决办法 出现问题的原因 控制台报错是因为冗余导航，也就是你在同一个导航上连续重复点击多次造成的，虽然无大碍，但控制台报错还是会令人难受 解决办法 办法一：在终端上安装npm i vue-router@3.0 -S 如果显示上述图片表明安装成功，之后再次运行程序npm run dev，重复点击就不会报错啦 办法二：在你创建的项目的route
chrome console 阻止 Navigated to
weixin_30929195的博客
07-29 4525
阻止如图 chrome 如图信息 转载于:https://www.cnblogs.com/heboliufengjie/p/5718030.html
错误 “Avoided redundant navigation to current location…” 的解决方案
最新发布
weixin_47151361的博客
05-09 724
vue 项目中使用 vue-router 的 编程式导航 写法进行路由切换时：如果用户在页面 多次点击按钮 时，浏览器的控制台报如下错误：vue-router 实例上的 push 方法返回的是 promise 对象，所以传入的参数期望有一个成功和失败的回调，如果省略不写则会报错。方案一：每次使用 push 方法时带上两个回调函数： 方案二：重写 Vue-router 原型对象上的 push 函数：
Vue路由导航报错：NavigationDuplicated: Avoided redundant navigation to current location解决方法
热门推荐
背心的博客
09-28 5万+
Vue路由跳转报错：NavigationDuplicated: Avoided redundant navigation to current location解决方法
错误 “Avoided redundant navigation to current location...” 的解决方案
FunSober的博客
10-31 1万+
使用编程式导航路由跳转时，需要指定成功和失败的回调函数。
vue报错 Avoided redundant navigation to current location: “/search“
weixin_49107940的博客
07-19 530
vue报错Avoidedredundantnavigationtocurrentlocation"/search"
解决vue打包后刷新页面报错：Unexpected token <
10-16
主要介绍了解决vue打包后刷新页面报错：Unexpected token <相关知识点，需要的朋友们参考下。
Vue实现点击导航栏当前标签后变色功能
10-14
在Vue.js中，实现点击导航栏当前标签后变色的功能是一项常见的需求，它能提供良好的用户体验，让用户清楚地知道当前所在页面。以下是如何利用Vue.js实现这一功能的详细步骤和相关知识点。 首先，我们需要在HTML模板...
Vue项目报错：Uncaught SyntaxError: Unexpected token <
10-17
主要介绍了Vue项目报错：Uncaught SyntaxError: Unexpected token <，在引入第三方依赖的 JS 文件时，遇到的一个问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Vue项目报错：Uncaught SyntaxError: Unexpected token
01-19
今天做一个 VUE 的项目，在引入第三方依赖的 JS 文件时，遇到了一个问题： 控制台的提示：Uncaught SyntaxError: Unexpected token < 按照提示进入文件，再看如下图： 仔细看了看 index.html 文件,发现原本我...
Vue实现导航栏点击当前标签变色功能
10-16
主要为大家详细介绍了Vue实现导航栏点击当前标签变色功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
VUE路由重复错误
qq_32234855的博客
07-16 861
说明文档: https://github.com/vuejs/vue-router/releases?after=v3.3.1 只是遇到了这种情况，然后搬运教程里面的解决方式 1.产生错误的情况：编程式路由跳转到当前路径且参数没有变化时会抛出 NavigationDuplicated(重复导航) 错误 2.原因分析: vue-router3.1.0之后, 引入了push()的promise的语法, 如果没有通过参数指定回调函数就返回一个promise来指定成功/失败的回调, 且内部会判断如果要跳转的路径和.
vue报错“NavigationDuplicat: Avoided redundant navigation to current location”解决方法
Jelly_11的博客
02-08 4195
方法1 查看自己的vue-router版本，如果在在3.0版本以上，将其改为3.0版本。 方法2 修改push源码，在router下的index.js文件中添加下列代码即可。 // 解决vue-router在3.0版本以上重复报错问题 const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function push(location) { return originalPush.call(this, locati
路由报错分析：avigationDuplicated: Avoided redundant navigation to current location:
m0_63989259的博客
05-04 466
重复路由报错分析
Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location报错
m0_64351096的博客
09-26 1万+
​ 解决 Vue 路由传递参数时，出现 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation 问题. 报错内容：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/search/111". 问题描述：重复点击导航时，控制台报错 ​
vue-router.esm.js:2046 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to c
m0_56284685的博客
03-04 1355
报错原因：重复点击路由导致，因为vue-router引入了promise,当我们使用this.$router.push时候需要多添加成功或失败的回调，否则就会报出以上的错误。跳转后使用catch语句对错误不再进行处理。
Avoided redundant navigation to current location: “/search“
weixin_58293163的博客
09-12 159
navigation的bug解决 call与apply的不同点
NavigationDuplicated: Avoided redundant navigation to current location: “/search/abc?k=ABC“.
cjhxydream的博客
08-09 579
NavigationDuplicated: Avoided redundant navigation to current location
vue中这个报错怎么解决NavigationDuplicated: Avoided redundant navigation to current location: "/SearchRecord".
09-20
这个错误提示表示在vue中进行了冗余的导航操作，即跳转到了当前位置。解决这个问题的方法是使用`catch`方法来捕获错误并处理。 你可以在路由跳转的代码中加入`catch`方法，如下所示： ```javascript this.$router.push({ path: '/SearchRecord' }).catch(err => {}) ``` 这样就可以避免出现冗余导航的错误提示。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值