el-menu default-active默认选中后切换菜单后不会取消高亮

标签的写法，sidebar-item是一个子组件，遍历菜单详细信息的

<el-menu mode="vertical" :default-active="$route.path" :default-openeds="openeds">
<sidebar-item :routes="menus"></sidebar-item>
</el-menu>

sidebar-item 页面：

<template v-for="item in routes">

<router-link v-if="item.children==null &&item.pid==menuID" :to="item.url">
<el-menu-item :index="item.id+'/'+item.name" class='submenu-title-noDropdown'>
<svg-icon v-if='item.icon' :icon-class="item.icon"></svg-icon><span slot="title">{{item.name}}</span>
</el-menu-item>
</router-link>
<el-submenu :index="item.id+'/'+item.name" v-if="item.children ">
<template slot="title">
<svg-icon v-if='item.icon' :icon-class="item.icon"></svg-icon><span>{{item.name}}</span>
</template>
<template v-for="child in item.children" v-if='item.children '>
<router-link v-if="child.show == 1" :to="child.url">
<el-menu-item :index="child.id+'/'+child.name">
<span>{{child.name}}</span>
</el-menu-item>
</router-link>
</template>
</el-submenu>
</template>

问题出现的地方是这里：这个index是菜单的key，一定不能是空，或者只是父级路由地址，比如：/topMenu
而children路由里的 path设为“”，设为空的目的是进来主菜单后，默认跳转到path: “”的页面上，这就导致了，这个菜单会一直高亮，不管选中其它任何菜单都不会改变这个菜单的高亮属性

修改子菜单路由地址，不要设为空“”

• 点赞
• 收藏
• 分享
• 文章举报