【面试题】Vue2动态添加路由 router.addRoute()
Vue2动态添加路由
场景: 一般结合VueX和localstorage一起使用
router.addRoutes
vue-router4后 已废弃:使用 router.addRoute() 代替。
vue-router4版本前也可用
函数签名:
router.addRoutes(routes: Array<RouteConfig>)
动态添加更多的路由规则。参数必须是一个符合 routes 选项要求的数组。
案例:
let routerObj = { path: '/about', name: 'about', component: () => import('../views/about.vue') }
router.addRoutes([routerObj]) //addRoutes在vue - router4里要被移除了 ,参数是数组
router.addRoute
添加一条新路由规则。如果该路由规则有 name,并且已经存在一个与之相同的名字,则会覆盖它。
函数签名:
addRoute(route: RouteConfig): () => void
router.addRoute
添加一条新的路由规则记录作为现有路由的子路由。如果该路由规则有 name,并且已经存在一个与之相同的名字,则会覆盖它。
函数签名:
addRoute(parentName: string, route: RouteConfig): () => void
案例:
let routerObj = { path: '/about', name: 'about', component: () => import('../views/about.vue') }
router.addRoute(routerObj) //vue-router4版本后要使用addRoute,参数是对象