vue跳到相同路由的时候,报错Avoided redundant navigation to current location: xxxx

如题:当我们处在a页面的时候,继续push当前页面的path的话,chrome控制台就会报错(但是不影响正常跳转)


image.png

解决方案:隐藏当前错误;
解决办法:在router.js 里面重写push方法(replace方法同理)

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

分析:其实重点就是后面的.catch(err => err) 用来捕获err
需要注意的是,可能会出现另一个问题:vue-router版本如果比较旧或者安装方式的问题,在本地环境会出现另一个错误(同样不影响正常跳转)

image.png

可以看出,错误原因就是 undefined不存在catch
然后打完断点进去发现,报错的项目的push方法是这样的:
image.png

不报错的是这样的:

image.png

可以看出,后者判断了如果支持promise,则会返回一个promise,而前者直接调用了push;
解决办法就是使用 npm 升级当前vue-router : npm update vue-router --save

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容