Vue嵌套路由(vue-cli项目写法)
const routes = [
{
path: '/',
redirect: '/home',
},
{
path: '/home',
component: Home
},
{
path: '/about',
component: () => import('../views/About.vue'),
children: [
{
path: 'son1',
component: () => import('../views/AboutSon1.vue'),
children: [
{
path: 'sonson1',
component: () => import('../views/AboutSonSon1.vue')
},
{
path: 'sonson2',
component: () => import('../views/AboutSonSon2.vue')
}
]
},
{
path: 'son2',
component: () => import('../views/AboutSon2.vue'),
}
]
}
]
- 可以无限套下去,但是记得一点:二层上有
children
子路由,那么记得在第二层那个组件上添加router-view
以及路由跳转事件或其他方式
来进行跳转