Dynamically add child routes in Vuejs
You can use $router.addRoutes
to re-add a route, specifying children.
You'll need to get the current route definition (as opposed to the $route
object) by searching the $router.options.routes
array for the route definition object that matches the current $route.path
. Then add a children
array of route definitions to the object and pass it to $router.addRoutes
.
created() { let { routes } = this.$router.options; let routeData = routes.find(r => r.path === this.$route.path); routeData.children = [ { path: 'bar', component: Bar }, { path: 'baz', component: Baz }, ]; this.$router.addRoutes([routeData])}