繁体   English   中英

使用lodash.js将平面数组转换为树数组

[英]Flat array to tree array using lodash.js


我试图将一个平面数组转换为树数组,因为我将使用jsTree中的数据。 此外,我需要将“名称”等关键名称转换为“文本”。
我想使用lodash.js,但我真的是lodash的新手。 我搜索了解决方案,但我找不到任何适合我的情况。
你能帮忙吗? 我的平面阵列数据如下:

[
    {
        Id:1,
        Name: 'name1',
        Parent: 0
    },
    {
        Id:2,
        Name: 'name2',
        Parent: 1
    },
    {
        Id:3,
        Name: 'name3',
        Parent: 2
    },
    {
        Id:4,
        Name: 'name4',
        Parent: 1
    },
    {
        Id:5,
        Name: 'name5',
        Parent: 1
    },
    {
        Id:6,
        Name: 'name6',
        Parent: 5
    }
]

我想有树数据,如:

{
    "id": 1, 
    "text" : "name1", 
    "children" : [
        { 
            "id": 2, 
            "text" : "name2", 
            "children" : [{
                "id": 3,
                "text": "name3"
            }] 
        },
        { 
            "id": 4, 
            "text" : "name4" 
        },
        { 
            "id": 5, 
            "text" : "name5",
            "children" : [{
                "id": 6,
                "text": "name6"
            }]  
        }
    ]
}

先感谢您

这是一个简单的Javascript中针对未分类数据的提议。

 var data = [{ Id: 1, Name: 'name1', Parent: 0 }, { Id: 2, Name: 'name2', Parent: 1 }, { Id: 3, Name: 'name3', Parent: 2 }, { Id: 4, Name: 'name4', Parent: 1 }, { Id: 5, Name: 'name5', Parent: 1 }, { Id: 6, Name: 'name6', Parent: 5 }], tree = function (data, root) { var r; data.forEach(function (a) { this[a.Id] = { id: a.Id, text: a.Name, children: this[a.Id] && this[a.Id].children }; if (a.Parent === root) { r = this[a.Id]; } else { this[a.Parent] = this[a.Parent] || {}; this[a.Parent].children = this[a.Parent].children || []; this[a.Parent].children.push(this[a.Id]); } }, Object.create(null)); return r; }(data, 0); document.write('<pre>' + JSON.stringify(tree, 0, 4) + '</pre>'); 

如果您不确定孩子是否不能出现在父母之前,那么您可以使用以下代码:

 var t = [{ Id: 1, Name: 'name1', Parent: 0 }, { Id: 2, Name: 'name2', Parent: 1 }, { Id: 3, Name: 'name3', Parent: 2 }, { Id: 4, Name: 'name4', Parent: 1 }, { Id: 5, Name: 'name5', Parent: 1 }, { Id: 6, Name: 'name6', Parent: 5 }]; var elements = []; t.forEach(function(element) { elements[element.Id] = { id: element.Id, text: element.Name, parent: element.Parent, children: [] } }); elements.forEach(function(element) { elements[element.parent] && elements[element.parent].children.push(element); delete element.parent; }) document.write(['<pre>', JSON.stringify(elements[1], 0, 3), '</pre>'].join('')); 

就像是

return _(data).map(function(val) { val.children = []; })
.map(function(val, key) {
    data[val.parent].children.push(val);
});

滥用数组索引。 您可能需要首先在源数据中构建从Idindex的辅助映射。

这只是对Array.map使用,所以这个解决方案不需要lodash。

下面的函数从对象列表构建树。 它对任何格式都不紧张。

function buildTree(flatList, idFieldName, parentKeyFieldName, fieldNameForChildren) {
    var rootElements = [];
    var lookup = {};

    flatList.forEach(function (flatItem) {
      var itemId = flatItem[idFieldName];
      lookup[itemId] = flatItem;
      flatItem[fieldNameForChildren] = [];
    });

    flatList.forEach(function (flatItem) {
      var parentKey = flatItem[parentKeyFieldName];
      if (parentKey != null) {
        var parentObject = lookup[flatItem[parentKeyFieldName]];
        if(parentObject){
          parentObject[fieldNameForChildren].push(flatItem);
        }else{
          rootElements.push(flatItem);
        }
      } else {
        rootElements.push(flatItem);
      }

    });

    return rootElements;
  }

这是一个使用您的示例作为输入的小提琴

原始来源来自这个答案

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM