代码之家  ›  专栏  ›  技术社区  ›  jose

在子节点级别数目不确定的对象嵌套数组中迭代

  •  0
  • jose  · 技术社区  · 4 年前

    在一个 多节点树 ,当我添加新行时,我需要通过其id获取该行的引用,以编程方式触发rowclick事件。

    在下面的示例中,如果我添加id为9的行,那么如何通过树迭代到此节点。

    注意:子节点的子节点是无限的(例如:父节点的子节点…)

    树示例

    let data = [{
        "id": 1,
        "name": "parent 1"
    }, {
        "id": 2,
        "name": " parent 2",
        "children": [{
            "id": 5,
            "name": "parent-children 5",
        },{
            "id": 6,
            "name": "parent-children 6",
            "children": [{
                "id": 7,
                "name": "parent-children-children 7",
            },{
                "id": 8,
                "name": "parent-children-children 8",
                "children": [{
                    "id": 9,
                    "name": "parent-children-children-children 9",
                },{
                    "id": 10,
                    "name": "parent-children-children-children 10",
                }]
            }]
        }]
    }, {
        "id": 3,
        "name": "parent 3"
    }, {
        "id": 4,
        "name": "parent 4"
    }]
    

    一级和二级节点上的迭代

    getItemRow(id){
        //If is a parent node
        let myItem = this.parents.find(parent => parent.id === id);
        if(myItem !== undefined){ return myItem }
    
        //If is a second level children node (parent-children)
        this.parents.forEach(function(parent){
            let child = parent.children.find(child => child.id === id);
            if(child !== undefined){ return child }
    
        });
    }
    
    2 回复  |  直到 4 年前
        1
  •  2
  •   Willow    4 年前

    我们可以递归搜索所有节点,直到找到匹配的节点:

    getItemRow(id){
        return findNodeWithId(id, this.parents)
    }
    
    findNodeWithId(id, rootArr) {
      for (let el of rootArr) {
        if (el.id === id) {
          return el
        }
        if (el.children) {
            const idFoundInChildren = findNodeWithId(id, el.children)
            if (idFoundInChildren !== null) {
              return idFoundInChildren
            }
        }
      }
      return null
    }
    
        2
  •  1
  •   Nina Scholz    4 年前

    可以进行递归,直接或通过搜索子数组找到对象。

    const
        find = (array, id) => {
            let result;
            array.some(o => result = o.id === id
                ? o
                : find(o.children || [], id)
            )
            return result;
        },
        data = [{ id: 1, name: "parent 1" }, { id: 2, name: " parent 2", children: [{ id: 5, name: "parent-children 5" }, { id: 6, name: "parent-children 6", children: [{ id: 7, name: "parent-children-children 7" }, { id: 8, name: "parent-children-children 8", children: [{ id: 9, name: "parent-children-children-children 9" }, { id: 10, name: "parent-children-children-children 10" }] }] }] }, { id: 3, name: "parent 3" }, { id: 4, name: "parent 4" }];
    
    console.log(find(data, 9));