Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.5k views
in Technique[技术] by (71.8m points)

vue-router 命名路由重名问题

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

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


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

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


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...