javascript - vue-router 命名路由重名问题

Question

一个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模块下的操作日志。我想的解决方案是在同名路由下用导航钩子做跳转。但是这样太麻烦，因为涉及到好几个模块下的同名路由，而且不利于后期维护。

如果要用命名路由，这种重名问题该如何解决？

Answer 1

用不同的名字吧。name要保证唯一，再说，这个name你又不是直接拿去显示。如果想用于显示，放到meta中去。

Answer 2

楼主。不太明白你的问题是啥意思。这个本来就是不同的路径，怎么会都跳到A的日志呢？难道不是匹配路径的吗？