一个spa应用,每个用户权限不同导致后端一二三级导航都会或多或少不太一样。
由于页面上百个,这里我们采用命名路由的方式。因为这样不需要考虑给每个路由设置路径,只需要后端传每个导航的名字就够了。
可是做到一半,我们发现会有命名重复
的问题,比如在一级导航A和B的二级导航中都有操作日志
这个二级导航。这样就会导致哪个router写在前面,就会渲染到那个同名的二级导航。
const Router = new VueRouter({
mode: 'history',
base: __dirname,
routes: [
{
path: '/a',
component: a,
name: 'A模块',
children: [
{
path: 'log',
component: a111,
name: '操作日志',
}
]
},
{
path: '/b',
component: b,
name: 'B模块',
children: [
{
path: 'log',
component: b111,
name: '操作日志',
}
]
},
]
});
大概就是这个样子,不管点哪个都会跳到A模块下的操作日志。我想的解决方案是在同名路由下用导航钩子做跳转。但是这样太麻烦,因为涉及到好几个模块下的同名路由,而且不利于后期维护。
如果要用命名路由,这种重名问题该如何解决?
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…