element-ui el-menu 匹配不到路由时会选中index为null的item

前言

项目中首页和具体的菜单页分开展示，头部和尾部共用一个。首页展示如下：

index

代码：

const menus = [... {
        name: '2',
        url: '/info',
        children: [{
                name: '系统'，
                url: '/system'
            },
            {
                name: '厂商'，
                url: '/firm'
            }
        ]
    }...]

 
            
        

需求

菜单2下面的系统和厂商要求点击不跳转

实现

把对应的url注释掉

结果

点击的时候不会选中菜单，页面不跳转。但是访问其他子页面后，通过浏览器回退按钮退回到index页面时，莫名就选中了2菜单栏，包括下面2个子菜单。如下图：

error

想了下应该是子菜单没有设置唯一标志index。而且/index这个路由在menus中也找不到，所以就默认匹配index===null的路由了?于是给el-menu-item加上index,果然好了。

总结

el-menu el-menu-item 一定要设置唯一index。