Question

我有一个javascript对象如下：

MainData: Object
 ->SubData: Array[23]
   ->0:Object
       Name : "ABC"
       ID: 1
       ->DataToDisplay :Array[2]
         ->0:Object
           Guid :"18189-90"
           Geo : "USA"
         ->1 : object
           Guid : "234-8089"
           Geo :"UK"
         OtherIrrelevantData : SomeData
         ->Children:Array[20]
           ->0:Object
              Name:"DEF"
              ID:2
              ->DataToDisplay : Array[1]
                ->0:object
                Guid :"18167-90"
                Geo : "Nor"
              ->Children : Array[5]
                ->0:Object 
                   Name : "GHI"
                   ID : 3 
                   ->DataToDisplay :Array[2]
                    ->0:Object
                      Guid :"18189-90"
                      Geo : "Ger"
                    ->1 : object
                      Guid : "234-8089"
                      Geo :"Pol"
                    otherirrelevantData : SomeData

我的目标是只显示数组＆＃34; DataToDisplay＆＃34;在递归的html页面中。例如：如果控件匹配名称：＆＃34; ABC＆＃34; ，我应该能够显示，5 Geo命名根目录＆＃34; ABC＆＃34; 。我需要一个名称为＆＃34; ABC＆＃34;和＆＃34; DataToDisplay＆＃34;根据它，＆＃34; DEF＆＃34;和＆＃34; GHI＆＃34;也是。

如果数据与名称＆＃34; GHI＆＃34;匹配，我需要一个名为＆＃34; GHI＆＃34;的对象。和它下面的DataToDisplay。

我正在尝试使用forach循环，但在添加节点时失败。有关从上述信息中提取数据的建议吗？

Answer 1

tree-node-utils可以满足您的需求。查看“查找节点”＆＃39;本演示中的函数：https://linsight.github.io/tree-node-utils/demo/dist/

这是ES6中findNodes的实现：

findNodes(nodes, predicate) {
  let found = [];
  const self = this;
  for (const node of nodes) {
    if (predicate(node)) {
      found = [...found, node];
    }

    if (self.hasChildren(node)) {
      const foundChildren = self.findNodes(node.children, predicate);
      found = [...found, ...foundChildren];
    }
   }

   return found;
  };

它的作用是：

遍历所有根节点;
对于每个人，使用回调函数predicate
如果回调函数通过
如果节点有子数据，则递归地为所有子节点执行相同的操作
返回结果。

在您的情况下，您的predicate功能就像：

function canDisplay(node){ return node.Name === 'ABC'; }

在javascript中提取树对象相关数据

1 个答案: