当前位置: 首页 > news >正文

react ant ice3 实现点击一级菜单自动打开它下面最深的第一个子菜单

1.问题

默认的如果没有你的菜单结构是这样的:

[{children: [{name: "通用配置"parentId: "1744857774620672"path: "basic"}],name: "系统管理"parentId: "-1"path: "system"}
]

可以看到每层菜单的path都只有当前的路径,没有进行全拼接。
那么此时点击一级菜单就会有问题:
在这里插入图片描述

2.解决

让一级菜单进行全拼接,二三级等子菜单不做处理,仍然保持当前的path,也就是点击一级菜单自动打开它下面最深的第一个子菜单。

/*** @description: 递归 设置一个父亲菜单完整的菜单路径,* 例如:[{path:home,children;[{path:console}]}]* 得到:[{path:home/console,children;[{path:console}]}]* @param menuData 递归的对象* @param parentPath 父路径* @returns 替换后的对象*/
export const setParentPaths = (data) => {if (data.length === 0) return;data.forEach((i) => {const concatPaths = (item, parentPath = "") => {const currentPath = parentPath + "/" + (item.path || item.fullPath);if (item.children && item.children.length > 0) {item.fullPath = concatPaths(item.children[0], currentPath);} else {item.fullPath = currentPath;}return item.fullPath;};concatPaths(i);});return data;
};

在这里插入图片描述

http://www.lryc.cn/news/165287.html

相关文章:

  • 关于 Qt串口不同电脑出现不同串口号打开失败 的解决方法
  • 可观测性在灰度发布中的应用
  • vscode开发油猴插件环境配置指南
  • 网站不收录没排名降权怎么处理-紧急措施可恢复网站
  • C++vector模拟实现
  • 《DATASET DISTILLATION》
  • GDPU 数据结构 天码行空1
  • 【C++】红黑树的模拟实现
  • 【多线程】Thread 类 详解
  • LINUX 网络管理
  • refresh rate
  • 使用 NGINX Unit 实施应用隔离
  • 2023/09/12 qtc++
  • 全科医学科常用评估量表汇总,建议收藏!
  • 了解消息中间件的基础知识
  • 【linux】Linux wps字体缺失、加粗乱码解决
  • 每日两题 103二叉树的锯齿形层序遍历(数组) 513找树左下角的值(队列)
  • ROS2报错:ImportError: cannot import name ‘Log‘ from ‘rosgraph_msgs.msg‘
  • 【Vue】Vue中的代码分为哪几种类型?
  • es6中includes用法
  • QT中QRadioButton实现分组C++
  • kafka实战报错解决问题
  • vite+react 使用 react-activation 实现缓存页面
  • 【android 蓝牙开发——蓝牙耳机】
  • Golang goroutine 进程、线程、并发、并行
  • 如何做到安全上网
  • 优维低代码实践:菜单
  • git merge 如何撤销
  • 解读package.json 中的功能
  • UMA 2 - Unity Multipurpose Avatar☀️四.UMA人物部位的默认颜色和自定义(共享)颜色