antdesignpro prolayout 三级菜单问题

三级菜单问题

活动系统
-----选择活动
------------创建活动
采用的方式是选择活动和创建活动在同级,隐藏创建活动
但从选择活动跳转到创建活动会导致在侧边导航不显示了。antdesignpro prolayout 三级菜单问题_第1张图片

解决方法

selectedKeys
在protable上使用 _selectedKeys _属性

第一步:重写一下左侧链接菜单

在跳转的前做一些事情(设置当前选择的菜单的key)
antdesignpro prolayout 三级菜单问题_第2张图片


第二步:没了。。。

我本以为还需要设置 跳转到隐藏了的菜单路由页面里 需要设置跳转之前的路由的key
是不用的,隐藏的路由不会给选上。。。这样就算完事了



刷新后自动选中的问题

当刷新页面后,由于没有触发onClick事件设置当前选择的item,所以会不显示选中

解决方法

第一步

路由里都设置好key

第二步

刷新时候拿到当前的路径名称【props.location.pathname】去匹配key

antdesignpro prolayout 三级菜单问题_第3张图片
我是采用了引入config里配置的路由去生成一个字典,
用路径名(pathname)做key,config路由的“key”字段做value,生成一个字典,每次刷新后用拿到这个pathname去字典匹配~


后续

应该有三级菜单的问题的原生框架解决方案,不过我们的项目好像已经错过了最佳的解决时间…

antdesignpro prolayout 三级菜单问题_第4张图片
https://github.com/ant-design/ant-design-pro-layout/issues/199



搬家语雀了

csdn编辑器太难用了

原文语雀
https://www.yuque.com/wuzhao/kb/az1xxo

你可能感兴趣的:(前端,react)