a-tree-select value值重复导致树的层级错乱

最新推荐文章于 2024-03-25 16:04:16 发布

造梦者FZ

最新推荐文章于 2024-03-25 16:04:16 发布

阅读量710

点赞数 1

分类专栏： vue 问题解决方案文章标签： typescript javascript 前端

本文链接：https://blog.csdn.net/qq_43923146/article/details/127268229

版权

vue 同时被 2 个专栏收录

80 篇文章 5 订阅

订阅专栏

问题解决方案

10 篇文章 0 订阅

订阅专栏

本文介绍了一种通过在后端为不同层级的树状组件添加唯一标识符(flag)的方法来解决value值重复导致的层级错乱问题。通过递归地修改树状组件的属性，确保每个节点的value值都是唯一的，并且父节点不可被选中。

摘要由CSDN通过智能技术生成

a-tree-select value值重复导致树的层级错乱

可以让后端给每一层级添加一个字段flag
例如：第一级 flag:‘A’,第二级：flag:‘B’…
然后递归

// 递归编辑改变选择树的属性
export function recursiveTree(arr:any) {
  arr.forEach((item:any,index:number) => {
    if(!item.isLeaf){
      item.selectable=false//父节点不能选中
    }
    item.value = item.id?item.flag+item.id//为了value不重复让后端添加层级标识拼接
   	item.label = item.name;
  
    if (item.small_classes) {
      item.children = item.small_classes;
    }
    if (item.children&&item.children.length>0) {
      recursiveTree(item.children);
    }
  });
  return arr
}