本文讨论了一个关于Vue-router的多层嵌套路由问题，当访问第一层路由时，期望同时渲染第二层和第三层组件，但实际只渲染到第二层。在路由配置中，尽管路径正确，第三层组件未能正常显示。作者尝试了一个临时解决方案，即在第一层路由的children中直接包含第三层组件，但不确定这种方法是否会产生其他问题。
问题是这样的，嵌套了三层路由
想路由匹配到第一层的时候可以同时渲染第二层路由跟第三层路由的组件
但是现在访问第一层路由的时候，只渲染了第一层跟第二层的组件，第三层的没有渲染出来
上代码(路由设计，就不上组件代码了(太多代码了)，给路由地址访问都是没问题，用的是渲染组件)：
{
path: '/level1',
component: level1,
meta: {
name: 'level1',
requiresAuth: true
},
children: [{
path: '',
component: level2,
meta: {
name: 'level2',
requiresAuth: true
}
}, {
path: 'level2',
component: level2,
meta: {
name: 'level2',
requiresAuth: true
},
children: [{
path: '',
component: level3,
meta: {
name: 'level2',
requiresAuth: true
}
}, {
path: 'level3',
component: level3,
meta: {
name: 'level2',
requiresAuth: true
}
}]
暂时没有找到问题，没有解决办法- -
补充一下，暂时找到一个解决方法，这个方法暂时还没发现会导致什么毛病
{
path: '/level1',
component: level1,
meta: {
name: 'level1',
requiresAuth: true
},
children: [{
path: '',
component: level2,
meta: {
name: 'level2',
requiresAuth: true
}
}, {
path: '',
component: level3,
meta: {
name: 'level2',
requiresAuth: true
}
}, {
path: 'level2',
component: level2,
meta: {
name: 'level2',
requiresAuth: true
},
children: [{
path: '',
component: level3,
meta: {
name: 'level2',
requiresAuth: true
}
}, {
path: 'level3',
component: level3,
meta: {
name: 'level2',
requiresAuth: true
}
}]
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
