【面試題】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,參數是對象