如何根据路由高亮 Element UI 里的 el-menu-item ？

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 关联，变成一个动态的值。