el-menu不想保留选中效果
时间: 2023-08-06 22:06:58 浏览: 95
如果你不想保留 el-menu 组件的选中效果,你可以设置 unique-opened 属性为 true,这样每次只有一个子菜单可以展开,并且点击其他菜单项时当前菜单项会自动关闭,不会保留选中状态。例如:
```
<el-menu :default-active="$route.path" unique-opened>
<el-menu-item index="/home">首页</el-menu-item>
<el-submenu index="1">
<template slot="title">菜单1</template>
<el-menu-item index="1-1">子菜单1-1</el-menu-item>
<el-menu-item index="1-2">子菜单1-2</el-menu-item>
</el-submenu>
<el-submenu index="2">
<template slot="title">菜单2</template>
<el-menu-item index="2-1">子菜单2-1</el-menu-item>
<el-menu-item index="2-2">子菜单2-2</el-menu-item>
</el-submenu>
</el-menu>
```
这个例子中,我们把 unique-opened 属性设置为 true,这样每次只有一个子菜单可以展开,点击其他菜单项时当前菜单项会自动关闭,不会保留选中状态。
希望这个回答能够帮到你!
相关问题
el-menu不保留选中效果
如果 el-menu 不保留选中效果,可能是因为你没有设置 active-class 属性。可以在 el-menu 组件中设置 active-class 属性,将选中项的样式类设置为特定的值。例如:
```
<el-menu :default-active="$route.path" active-class="active-menu">
<el-menu-item index="/home">首页</el-menu-item>
<el-menu-item index="/about">关于我们</el-menu-item>
<el-menu-item index="/contact">联系我们</el-menu-item>
</el-menu>
```
在这个例子中,我们将选中项的样式类设置为 "active-menu"。你可以在 CSS 样式中定义该类的样式,在选中项被激活时,该类将自动添加到选中项的元素上,并应用定义好的样式。
希望这个回答能够帮到你!
阅读全文