Ant-design-pro: 关于点击二级菜单会自动收缩到上级菜单的坑的说明

[pkaq]

与之相关的issue有

• #5116
• #4843
• #4760
• #4869

目前看来出现此问题的原因大概有2

• 路由层级真的不规范 ，可以参考 路由配置 进行正确配置

• 在v2时代，后台返回的数据中有一项 key 属性，而此属性是跟 id 相同的， 那么问题就出在这里，升级到 v4 之后，看上去 key 需要跟 path 相同或者干脆去掉才可以了 因为渲染菜单的时候
  ul的id会渲染为<ul id="[远程返回的key]$Menu"> ,而路由 生成的则是 <ul id="[path]$Menu">
  具体表现的症状就会体现为，二级菜单点击后无选中效果，且上级菜单会自动收起

翻阅了所有相关issue官方建议无非2个，
1.检查路由配置
2.我们提供了 这俩属性 可以解决一切此类问题

那么疑问来了，
1.从初代版本到现在，官方始终坚持不把菜单放到mock加载的初心是什么？
2.生成菜单以及菜单的折叠 用id pid关联有何不妥？因为用path关联折叠后台一旦调整了菜单归属在保证原菜单路径不变的前提下，前端不调整路由和重新规划菜单路径 根本无法正确折叠

[chenshuai2144]

总结的不错，来个 FAQ 如何？

[chenshuai2144]

.从初代版本到现在，官方始终坚持不把菜单放到mock加载的初心是什么？

动态菜单并不是必须要的。

2.生成菜单以及菜单的折叠 用id pid关联有何不妥？因为用path关联折叠后台一旦调整了菜单归属在保证原菜单路径不变的前提下，前端不调整路由和重新规划菜单路径 根本无法正确折叠

根据 id 只有在动态菜单下才需要，我们留了 key 的口子，用来表示唯一的参数。如果你需要很复杂的用法，简直直接自己 render 菜单

[leshalv]

动态菜单在中后台程序中我认为还是比较重要的，毕竟很多东西还有从服务器端获取，前端渲染，很正常的一件事，网上动态菜单文章也挺多(说明大部分企业需求)，官方升级版本可能文章中的就不适用了，目前感觉v4的动态菜单真的有些迷，且文档不全，官方文档还是v2的routes 而源码声明中早已经改成children，通过观察，其他社区大部分中后台管理程序在动态菜单上做的很灵活很好，文档也很齐全，但是antd pro确实稍微有些不足

[chenshuai2144]

就我个人来说，我从来没写过动态菜单的项目。
如果你有兴趣，可以在这里提个 pull，我会将其部署为一个可预览的网页

[mzrybbd]

@leshalv 如何实现动态菜单，我试了网上的一些说法但是右侧的菜单不显示

[effapp]

十多年前就在用动态菜单了，这是个非常必要的功能啊

[effapp]

之前我提了这个问题，回复一直说是我的menuData的格式不对，搞了很久还是老样子，几个月时间就这么过了。

[effapp]

使用openKeys=｛false｝现在能解决点击二级菜单收缩到上级菜单的问题，但是仍然不能解决被选中菜单背景不高亮的问题，请问有什么办法解决“被选中菜单不高亮的问题”？
@chenshuai2144 而且您部署的可预览的网页中自定义菜单也不会高亮。

[ray-toby]

@effapp selectedKeys这个属性是可以的高亮的 我是结合之前版本试了下 可以高亮 但点击同级其他菜单时 该菜单不会收起 反正很多坑要填

[pkaq]

使用openKeys=｛false｝现在能解决点击二级菜单收缩到上级菜单的问题，但是仍然不能解决被选中菜单背景不高亮的问题，请问有什么办法解决“被选中菜单不高亮的问题”？
@chenshuai2144 而且您部署的可预览的网页中自定义菜单也不会高亮。

你的二级菜单 path 是否为 /上级菜单path/本级菜单?