vue-router.esm.js:2065 Uncaught (in promise) Error: Redirected when going from "/login?redirect=%2Fhome" to "/home" via a navigation guard.

发布时间 2023-10-05 11:12:20作者: Steven_YF

原因:
  vue-router路由版本更新产生的问题,导致路由跳转失败抛出该错误;
真正的原因是由于返回了一个Promise对象, 正常的跳转由then方法执行 当正常的路由跳转, 被"路由导航守卫"拦截并重新指定路由时, 由于 this.$router.push() 返回的是Promise对象, 此时then方法不能正常执行, 无法跳转到指定路由, 就触发了该对象的捕获错误的方法, throw抛出错误, 但并不影响程序功能.

解决方式:
通过重写VueRouter原型对象上的push方法, 覆盖原来抛出异常的方法, "吞掉"异常
切记: 一定要在router创建实例之前

// console.log(VueRouter);
let originPush = VueRouter.prototype.push;
let originReplace = VueRouter.prototype.replace;

// call与apply:相同点:都可以修改this,
            // 不同点:传递的参数,call传递多个参数时,以,作为分隔
                           //    apply传递多个参数时,以数组方式进行


// 重写push/replace
// 第一个参数:告诉原来push方法,你往哪里跳转(传递哪些参数)
// 第二个参数:成功的回调
// 第二个参数:失败的回调
VueRouter.prototype.push = function(location,resolve,reject) {
    if(resolve && reject) {
        originPush.call(this,location,resolve,reject);
    }else {
        originPush.call(this,location,()=>{},()=>{});
    }
}


VueRouter.prototype.replace = function(location,resolve,reject) {
    if(resolve && reject) {
        originReplace.call(this,location,resolve,reject);
    }else {
        originReplace.call(this,location,()=>{},()=>{});
    }
}