选中el-sub-menu的时候也高亮

当在Vue.js的Element UI组件库中，如果你想要实现点击`el-sub-menu`(子菜单)时能够使其高亮显示，通常可以在处理菜单遍历或点击事件的地方做文章。你可以给每个`el-sub-menu`添加一个`active`属性，并通过管理这个属性来控制高亮效果。例如，在点击事件处理器中检查当前激活的菜单，如果点击的是目标菜单，则将其设置为`active`，同时将其他非激活状态的子菜单设为默认样式。

以下是一个简单的示例：

<template>
  <el-menu default-active="1">
    <el-submenu v-for="(item, index) in menuList" :index="index + ':' + item.name">
      <template slot="title">{{ item.name }}</template>
      <el-menu-item v-for="subItem in item.children" :index="subItem.name">
        {{ subItem.name }}
      </el-menu-item>
    </el-submenu>
  </el-menu>
</template>

<script>
export default {
  data() {
    return {
      menuList: [
        { name: '一级菜单1', children: [{ name: '二级菜单1-1' }] },
        //...
      ]
    };
  },
  methods: {
    handleMenuClick(item) {
      this.$refs.menu.forEach(menu => {
        if (menu.index === item.index) {
          menu.activeIndex = item.index;
        } else {
          menu.activeIndex = null; // 清除其他子菜单的高亮
        }
      });
    }
  },
  mounted() {
    this.$nextTick(() => {
      // 初始化高亮第一个菜单
      this.handleMenuClick(this.menuList);
    });
  }
};
</script>

在这个例子中，`handleMenuClick`方法会在每次点击时调整子菜单的`activeIndex`。注意，你需要确保你的`el-menu`有一个ref，以便可以操作它的实例。