关于Vue+ElementUI 的导航菜单组件NavMenu，需要两次点击menu-item内容才能高亮显示得问题？

<template>
  <div class="nav">
    <el-menu
      :default-active="activeMenu"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
      router
      active-text-color="#FF3300"
    >
      <el-menu-item index="/"> 首页
      </el-menu-item>
      <el-submenu index="2">
        <template slot="title">项目管理</template>
        <el-menu-item index="/major"> 重大项目</el-menu-item>
        <el-menu-item index="/success"> 成功案例</el-menu-item>
      </el-submenu>
      <el-menu-item index="/invest">投资
      </el-menu-item>
      <el-menu-item index="/financing">融资
      </el-menu-item>
      <el-menu-item index="/pages/news">资讯</el-menu-item>
      <el-menu-item index="/firm">会员中心</el-menu-item>
    </el-menu>
  </div>
</template>
<script>
export default {
  computed: {
  // 我们使用计算属性来获取到当前点击的菜单的路由路径，然后设置default-active中的值
  // 使得菜单在载入时就能对应高亮
    activeMenu() {
      const route = this.$route
      const { meta, path } = route
      // 可以在路由配置文件中设置自定义的路由路径到meta.activeMenu属性中，来控制菜单自定义高亮显示
      if (meta.activeMenu) {
        return meta.activeMenu
      }
      return path
    }
  },
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    }
  }
};
</script>