pro-components 🧐可关闭[问题]使用splitMenu: true和mix模式后，路由设置二级路由或三级路由，点击二级菜单或三级菜单后，左侧菜单栏消失

提问前先看看：

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

🧐 问题描述

{ path: '/', name: '首页', routes: [ { path: '/routeDemo', name: '管理页', component: './routeDemo' } ] }

点击二级菜单后，左侧菜单栏直接消失了。

💻 示例代码

🚑 其他信息

Nov 27 '25 07:11 sunshineLing

Hi @sunshineLing! I'm Dosu and I’m helping the pro-components team.

这是已知的 ProLayout 行为限制：在 layout: 'mix' 且 splitMenus: true 时，顶部菜单只显示一级菜单，左侧菜单显示其余菜单。当你点击二级或三级菜单时，如果当前路由没有对应的子菜单，左侧菜单会消失，这是默认实现，并不是最近的 bug，也没有近期 PR 修复这个问题[#7833][#3098]。

要实现更复杂的菜单联动（比如顶部显示多级菜单，左侧始终有内容），需要自定义菜单渲染。官方推荐用 menuDataRender 或 menuRender，比如通过给菜单数据加自定义属性（如 topMenu: true），然后分别渲染顶部和侧边菜单。示例代码：

const menuDataRender = (menuData) => {
  // 只保留一级菜单，去掉 children，避免左侧菜单消失
  return menuData.map(item => ({ ...item, children: null }));
};

// ProLayout 组件中使用
<ProLayout
  menuDataRender={menuDataRender}
  // 其他配置...
/>

或者更复杂的自定义可以参考官方文档和相关 issue 讨论。

如果你需要在进入二级或三级路由时隐藏左侧菜单，也可以用 hideInMenu 或在 menuDataRender 里动态处理 children。具体实现可以参考这些 issue 的建议[#3098]。