Vue el-menu 父级菜单高亮丢失问题解决方法

Vue el-menu 父级菜单高亮丢失问题解决方法

在使用 Vue el-menu 组件时，如果父级菜单在子菜单被选中时没有高亮，可能是由于以下原因：

1. 没有正确设置 el-menu 组件的 'unique-opened' 属性。该属性用于控制是否同时只展开一个子菜单，如果没有设置或者设置不正确，可能会导致父级菜单的高亮丢失。

2. 没有正确设置 el-menu-item 组件的 'index' 属性。该属性用于标识菜单项的唯一标识符，如果没有设置或者设置不正确，可能会导致父级菜单的高亮丢失。

解决办法：

1. 确认 el-menu 组件的 'unique-opened' 属性设置正确，如果需要同时展开一个子菜单，设置为 true。

2. 确认 el-menu-item 组件的 'index' 属性设置正确，每个菜单项的 'index' 属性应该是唯一的。

3. 如果以上两点都没有问题，可以尝试使用 el-menu 的 'default-active' 属性来设置默认选中的菜单项，以确保父级菜单的高亮显示。

例如：

<el-menu default-active='1' unique-opened>
  <el-submenu index='1'>
    <template slot='title'>一级菜单</template>
    <el-menu-item index='1-1'>二级菜单1</el-menu-item>
    <el-menu-item index='1-2'>二级菜单2</el-menu-item>
  </el-submenu>
</el-menu>