vue-router3.x 升级 vue-router 4.x 踩坑之旅

最近在改造公司的老项目, 期间遇到了很多问题,此篇记录vue-router

1. 通配符的变化

// vue-router2
export const asyncRoutes = [
  { path: '*', redirect: '/404', hidden: true }
]

// vue-router3
export const asyncRoutes = [
  { path: '/:catchAll(.*)', redirect: '/404', hidden: true }
]

2. 动态添加路由变化

// vue-router2
router.addRoutes({})

vue-router3 只能单条添加
router.add({})
router.replace(to.path) // 想要路由跳转, 需手动触发