js中如何通过id查询或者删除树形结构某一个节点啊

ant design就是要这种数据结构, 才可以形成各类tree控件, 这点真不如ztree之类的, 人家只需要1个数组就行了, 指定好id和parentId就自动出tree, antd还得弄个children, 没感觉哪好

比如树形结构是这样的

[
    {
        id: '1',
        name: 'a',
        pid: '0',
        children: [
            {
                id: '11',
                name: 'a-1',
                pid: '1',
                children: [
                    id: '111',
                    name: 'a-1-1',
                    pid: '11',
                    children: null
                ]
            }
        ]
    },
    {
        id: '2',
        name: 'b',
        pid: '0',
        children: null,
    }
]

那么如果能快速找到id: '111'这个节点呢, 只能用递归查询吗, 有没有更好的方法
对他进行以下操作:
添加子节点: 即在他children中添加
删除该节点: 即删除id: '111'这个节点
更新节点

阅读 11.8k
2 个回答

加个转换层,重构的数据用id作为索引

// 搜索tree的节点 如果觉得不合理请自行优化
  static serachTree (data, serachText) {
    let treeData = JSON.parse(JSON.stringify(data))
    // 所有父节点
    let parent = []
    // 所有子节点
    let children = []

    //匹配节点
    function matchNode (treeNode) {
      if (!treeNode) {
        return -1
      }
      let name = treeNode.title;
      let numName = name.indexOf(serachText);

      if (numName != -1) {
        if(treeNode.pid){
          children.push(treeNode)
        }else{
          parent.push(treeNode)
        }
      }

    }

    // 取出所有节点
    function transformToArrayFormat (nodes) {
      if (!nodes) return [];
      let childKey = 'children',
        r = [];
      if (nodes.length) {
        for (let i = 0, l = nodes.length; i < l; i++) {
          r.push(nodes[i]);
          if (nodes[i][childKey].length > 0) {
            r = r.concat(transformToArrayFormat(nodes[i][childKey]));
          }

        }
      }
      else {
        r.push(nodes);
        if (nodes[childKey].length > 0) {
          r = r.concat(transformToArrayFormat(nodes[childKey]))
        }

      }
      return r;
    }


    let nodes = transformToArrayFormat(treeData)
    for (let i = 2; i < nodes.length; i++) {
      matchNode(nodes[i]);
    }

    // 查找出匹配的节点
    parent.forEach(item => {
      item.children = []
      children.forEach(node => {
        if(item.id === node.pid){
          item.children.push(node)
        }
      })
    })
    return parent
  }
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题