最近也碰到了这个问题,研究了一下,发现解决方法是这样子的:
假设有个路由如下:
{
path: '/example',
component: Example,
children: [
{ path: 'index',
component: Index,
children:[
{
path: 'submenu1',
name: 'Form',
component: Index,
},
{
path: 'submenu2',
name: 'Form',
component: Index,
}
]
]
},
对应的菜单为:example/index/submenu1~submenu2,我们的想法是想让submenu1和submenu2和index同级,也就是说将submenu1和submenu2渲染到Example组件中去,而不是渲染到Index组件中去,但是查了官方文档好像没有类似的实现,所以只能换一种思路.
其实很简单,只要将Index对应的组件中只写一个router-view就可以了,如下:
这样子虽然是渲染在Index中的,但是效果是一样的.