1:投机取巧:
在被路由导航守卫拦截后,执行代码 console.clear(),清空控制台的报错信息;
注意:next()方法时异步函数,需要在定时器中添加console.clear(),把这个操作添加进异步队列
router.beforeEach((to, from, next)=>{
if(to.meta.isShow && !getToken()){
next('/login')
setTimeout('console.clear()', 300)
return
}
next()
})
解决方式二: 啰嗦式
// 使用编程式导航跳转时,每次使用,后面都跟上.catch方法,捕获错误信息 this.$router.push('/location').catch(err => ())
解决方式二: 高逼格式
- 通过重写VueRouter原型对象上的push方法, 覆盖原来抛出异常的方法, "吞掉"异常
/* 在创建router实例对象之前,手动覆盖原型链的push来吞掉报错catch */
// 先存储默认底层的push
const originPush = VueRouter.prototype.push
// 覆盖原型链的push
VueRouter.prototype.push = function(location,resolve,reject){
// this:路由实例对象
// 判断用户有没有传后面两个可选参数
if( resolve || reject ){
return originPush.call(this,location,resolve,reject)
}else{// 用户只传了第一个参数
/*
默认底层: catch()方法代码 throw err : 抛出异常
吞掉报错原理: 重写catch()方法,把默认底层的 throw err给去掉,就不会抛出异常
*/
return originPush.call(this,location).catch(err=>{
// throw err
})
}
}
const router = new VueRouter({
routes
})