vue 解决NavigationDuplicated: Avoi

2022-01-20  本文已影响0人  CoderZb

\color{#FF00FF}{报错内容截图如下:}

image.png

\color{#FF00FF}{问题描述:}

点击退出登录,回到登录页面的时候,报NavigationDuplicated: Avoided redundant navigation to current location: "/login"的问题。

image.png

\color{#FF00FF}{原因:}

原因就是:点击退出登录执行了一遍router.replace({ path: "/login" }),回到登录页面的时候,在mounted(){ }清除缓存的时候,又执行了一遍router.replace({ path: "/login" })。即:对同一个页面进行了两次replace()操作。

\color{#FF00FF}{解决办法:}

router目录下的index.js文件添加如下代码

import VueRouter from 'vue-router'
Vue.use(VueRouter)
const RouterPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (to) {
  return RouterPush.call(this, to).catch(err => err)
}
const RouterReplace = VueRouter.prototype.replace
VueRouter.prototype.replace = function replace (to) {
  return RouterReplace.call(this, to).catch(err => err)
}
上一篇下一篇

猜你喜欢

热点阅读