Vue Router el-menu children 详情页父级菜单不高亮

如果你使用 Vue Router 和 Element UI 的 el-menu 组件时，遇到了子菜单进入详情页后父级菜单不高亮的问题，可以考虑以下解决方案：

在路由配置中给父级菜单的路由添加一个 meta 属性，用于标记该路由是菜单的顶级路由。

{
  path: '/parent',
  component: Parent,
  meta: {
    menu: true
  },
  children: [
    {
      path: 'child',
      component: Child
    }
  ]
}

在 el-menu 组件中，添加一个 v-if 判断，判断当前路由是否为顶级菜单，如果是，则设置该菜单为高亮状态。

<el-menu>
  <el-menu-item v-for="item in menu" :key="item.path" :index="item.path" v-if="!item.meta.menu || $route.matched.some(record => record.meta.menu)">
    {{ item.name }}
  </el-menu-item>
</el-menu>

这样就可以解决子菜单进入详情页后父级菜单不高亮的问题了。