根据这个官方示例,我们可以在 vuejs 中添加嵌套/子路由。但是我找不到任何关于动态添加这些子路由的方法的帮助/文档。例如,仅在访问父路由时添加子路由。
目前,Vue 应用程序中的所有路由都定义在我们创建 Router 实例的单个位置。有一个名为addRoutes的 api ,但我不知道如何使用它在其路由旁边添加延迟加载的应用程序功能。如果有人熟悉 Angular2+ 模块系统,那么它就有能力为该模块内的功能模块定义路由,甚至使它们延迟加载。想知道 VueJs 是否可以实现某些目标?
您可以使用$router.addRoutes
重新添加路线,指定孩子。
您需要通过在数组中$route
搜索与当前. 然后将路由定义数组添加到对象并将其传递给.$router.options.routes
$route.path
children
$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])
}