因为在路由视图中展示的组件包含自己的路由占位符,这个地方就可以用到嵌套路由。
说道嵌套路由了,那么我们接下来说一下嵌套路由的规则:
1、在某一个路由规则中采用children来声明嵌套路由的规则;
2、嵌套路由规则中的path不能以/开头,访问的时候需要使用/father/son的形式进行书写。
vue项目中,界面通常有多个嵌套的组件构成;同理,URL中的动态路由也可以按照某种结构对应嵌套的各层组件:
export default new Router({
routes: [
{
path: '/', // 根路由
name: 'HelloWorld',
component: HelloWorld
}, {
path: '/RouterComponents/:id',
component: RouterComponents,
children: [
{
path: '', // 默认路由
name: 'ComponentA', // 当匹配上RouterComponents后,默认展示在<router-view>中
component: ComponentA
},
{
path: '/ComponentB',
name: 'ComponentB',
component: ComponentB
},
]
}
]
})
总结:以上就是嵌套路由,感谢您的观看。