路由跳转el-menu更新

如果您想在路由跳转时更新El-Menu的选中状态，可以在路由导航后，手动设置El-Menu的当前选中项。

具体实现方法如下：

1. 在路由导航守卫中监听路由变化，获取当前路由路径。

router.beforeEach((to, from, next) => {
  const currentPath = to.path; // 获取当前路由路径
  // ...
  next();
})

2. 在El-Menu中设置`default-active`属性为当前路由路径。

<template>
  <el-menu
    :default-active="currentPath"
    class="el-menu-demo"
    mode="horizontal"
    @select="handleSelect"
  >
    <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>
</template>

3. 在`handleSelect`方法中，将当前选中项保存到Vuex或本地存储中，以便下次渲染时恢复选中状态。

methods: {
  handleSelect(index, indexPath) {
    this.$store.commit('setCurrentMenu', index); // 将当前选中项保存到Vuex
    localStorage.setItem('currentMenu', index); // 将当前选中项保存到本地存储
  }
}

4. 在组件创建时，从Vuex或本地存储中获取当前选中项，并设置给El-Menu。

created() {
  const currentMenu = this.$store.state.currentMenu || localStorage.getItem('currentMenu'); // 从Vuex或本地存储中获取当前选中项
  if (currentMenu) {
    this.currentPath = currentMenu; // 将当前选中项设置给El-Menu
  }
}

通过以上步骤，就可以实现路由跳转时更新El-Menu的选中状态了。