Error: Avoided redundant navigation to current location:

一只小炸毛

于 2020-07-14 19:19:28 发布

阅读量945

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Vue

本文链接：https://blog.csdn.net/qq_37418556/article/details/107345339

Vue 专栏收录该内容

17 篇文章

订阅专栏

本文详细解释了在Vue.js应用中，如何解决因重复点击相同菜单导致的避免冗余导航到当前位置的错误。通过修改VueRouter的push方法，可以有效避免这一问题，确保应用程序的稳定运行。

Error: Avoided redundant navigation to current location: “/users”.

问题触发原因：在Vue导航菜单中，重复点击一个菜单，即重复触发一个相同的路由，会报错，但不影响功能
在这里插入图片描述
解决：在router的配置文件中加入如下代码

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

加完变成：

Vue.use(VueRouter)
const routes = [{
    path: '/', redirect: '/login'
}, {
    path: '/login', component: Login
}]
// 解决上述问题
const originalPush = VueRouter.prototype.push
   VueRouter.prototype.push = function push(location) {
   return originalPush.call(this, location).catch(err => err)
}
const router = new VueRouter({
    routes
})
export default router

参考：https://blog.csdn.net/xiecheng1995/article/details/106497172/?utm_medium=distribute.pc_relevant.none-task-blog-baidujs-1