重复点击路由报错
vue-router.esm.js?a5e4:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/shop/marketing-center/activity-center"
解决方案：
1、在router文件中增加如下判断
const router = new VueRouter({
routes: []
})
// 解决重复点击相同路由报错问题
const VueRouterPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push (to) {
return VueRouterPush.call(this, to).catch(err => err);
}
export default router;
2、路由跳转时判断是否重复跳转
handleClickMenu(menu) {
if(this.$route.path !== menu.url){
this.$router.push({path: menu.url});
}
}
3、使用catch方法捕获router.push异常
this.$router.push(route).catch(err => {
console.log('输出报错', err);
})
网友评论