冗余导航(路由冗余)解决方式


项目中

报错: NavigationDuplicated: Avoided redundant navigation to current location:

(NavigationDuplicated: 避免了对当前位置的冗余导航)

解决方法:

这个报错的关键是this.$router.push(...).catch(err => err)要有后面的catch。因为跳转方法返回了一个promise对象,要有处理拒绝的方法。

首先检查,路由跳转的时候是不是调用的push方法,还是用的replace

打开 router 文件夹下的 index.js(路由文件)文件中添加如下代码:

// pust 方法

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

// replace 方法

const routerReplace = VueRouter.prototype.replace
VueRouter.prototype.replace = function (location) {
  return routerReplace.call(this, location).catch(error => error)
}

问题解决,祝我生日快乐好吧


文章作者: 中元
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 中元 !
 上一篇
炫酷的 CSS 文字特效 炫酷的 CSS 文字特效
css是前端开发者所必备的技能!那么,在开发过程中你对css效果又了解多少呢?在社区中看到一篇关于css文字特效的文章,摘取部分分享给大家
2022-09-01
下一篇 
前端必备八股文 前端必备八股文
八股文——旧时科举考试的一种文体,也称制义、制艺、时文、八比文。通俗来说(八股文就是指文章的八个部分)而计算机技术相关岗位面试中,八股文多指面试中常出现的问题,往往都是一些看起来高大上但是实际工作中没啥用的东西(科普结束,原文开始)
2022-07-18