el-menu
里的 default-active
在刷新页面的时候重置高亮的菜单,导致的结果就是当前页面和高亮的菜单不匹配。可以尝试用下面的代码来解决:
➥ Vue
<el-menu :default-active="$route.path" class="el-menu-vertical-demo" router>
<el-menu-item index="/home">
<i class="el-icon-menu"></i>
<span slot="title">导航一</span>
</el-menu-item>
<el-menu-item index="/home/bar" :route="{ path: '/home/bar' }">
<i class="el-icon-location"></i>
<span>导航二</span>
</el-menu-item>
<el-menu-item index="3" disabled>
<i class="el-icon-document"></i>
<span slot="title">导航三</span>
</el-menu-item>
</el-menu>
重点就是把 default-active
和 $route.path
关联,变成一个动态的值。