Redirected when going from "/xxx" to "/xxxx" via a navigation guard.

60d976621045a93c6ff393623d3b9a5.png

看到报错信息后，了解到是vue-router 3.10版本新增的promise对象，基本上都是说在跳转后加上.catch(() => {})来修正，但是代码修改的工作量比较大。找到了全局修改方法：

image.png

// 解决Vue-Router升级导致的Uncaught(in promise) navigation guard问题
// push
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location, onResolve, onReject) {
  if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
  return originalPush.call(this, location).catch(err => err)
}
 
// replace
const originalReplace = VueRouter.prototype.replace
VueRouter.prototype.replace= function replace(location) {
  return originalReplace.call(this, location).catch(err => err)
}
Vue.use(VueRouter)

很多博客上都只有全局修改push方法的，我们项目里有不少使用replace来做跳转的，所以修改后没有生效。以上这个是比较全的，可以参考使用。