Vue el-menu 进入详情页父级菜单不亮且刷新后不展开解决方案

这个问题可能是由于路由配置不正确导致的。

要解决这个问题，需要确保在路由配置中正确地设置了菜单项的路径和名称。例如，如果您的菜单项具有以下路径：

{  
  path: '/detail',
  name: 'detail',
  component: Detail
}

那么您的菜单项应该如下所示：

<el-menu-item index='/detail'>详情页</el-menu-item>

另外，如果您希望在进入详情页后自动展开父级菜单并高亮当前菜单项，您需要在路由配置中使用 meta 属性来指定菜单项的信息，例如：

{  
  path: '/detail',
  name: 'detail',
  component: Detail,
  meta: {  
    menuPath: '/detail',
    menuName: '详情页'
  }
}

然后在菜单项中使用 index 属性来指定菜单项的路径，使用 :default-active 属性来指定默认高亮的菜单项，使用 :default-openeds 属性来指定默认展开的菜单项，例如：

<el-menu
  :default-active="$route.meta.menuPath"
  :default-openeds="[$route.meta.menuPath.split('/')[1]]"
>
  <el-menu-item index="/">首页</el-menu-item>
  <el-submenu index="detail">
    <template slot="title">详情页</template>
    <el-menu-item :index="$route.meta.menuPath">{{ $route.meta.menuName }}</el-menu-item>
  </el-submenu>
</el-menu>

注意，这里使用 $route 对象来获取当前路由信息，所以需要在组件中引入 $route 对象。如果您使用的是 Vue Router 4.x 版本，您可以在组件中使用 useRoute() 函数来获取当前路由信息。

希望这可以帮助您解决问题。