带有每个节点路径的 javascript 树答案

【问题标题】：javascript tree with path for each node带有每个节点路径的 javascript 树
【发布时间】：2016-09-12 06:49:40
【问题描述】：

我正在尝试用每个节点的路径制作一棵树：

实际演示的 Plunkr（仅见控制台）：https://plnkr.co/edit/peCIZcSzChF3b2WnaOxk?p=preview

原始数据：（这是一个标签列表，“父”是父 ID）

var originals=[
    {"id":1,"name":"Grammaire","parent":null},
    {"id":2,"name":"Orthographe","parent":null},
    {"id":8,"name":"Orthographe lexicale","parent":2},
    {"id":9,"name":"Orthographe grammaticale","parent":2},
    {"id":10,"name":"Adjectif couleur","parent":9},
    {"id":11,"name":"Nombre","parent":8},
    {"id":12,"name":"Annalyse grammaticale","parent":1},
    {"id":19,"name":"Concordance des temps","parent":1},
    {"id":20,"name":"annalyse 2","parent":12}
];

所以它应该像这样制作一棵树：

1-Grammaire
  12-Annalyse grammaticale
    20-Annalyse 2
  19-Concordance des temps
2-Orthographe
  8-Orthographe lexicale
  9-Orthographe grammaticale
    10-Adjectif couleur
    11-Nombre

我得到了一个代码：

 function convert(array){
      var map = {};
      for(var i = 0; i < array.length; i++){
            var obj = array[i];
            obj["children"] = [];
            map[obj.id] = obj;
            var parent = obj.parent || '-';
            if(!map[parent]){
                 map[parent] = {
                      children: []
                 };
            }       
            map[parent].children.push(obj);
      }
      return map['-'].children;
 }

结果：

[
    {"id":1,"name":"Grammaire","parent":null,
        "children":[
            {"id":12,"name":"Annalyse grammaticale","parent":1,
                "children":[{"id":20,"name":"annalyse 2","parent":12,"children":[]}]
            },
            {"id":19,"name":"Concordance des temps","parent":1,"children":[]}
        ]},
    {"id":2,"name":"Orthographe","parent":null,
        "children":[
            {"id":8,"name":"Orthographe lexicale","parent":2,
                "children":[
                    {"id":11,"name":"Nombre","parent":8,"children":[]}]
            },
            {"id":9,"name":"Orthographe grammaticale","parent":2,
                "children":[{"id":10,"name":"Adjectif couleur","parent":9,"children":[]}]
            }
        ]
    }
]

问题！

例如对于 id = 20 的节点

 {"id":20,"name":"annalyse 2","parent":12,"children":[]}

我需要为此节点获取父节点 ID 和名称，如下所示：

{"id":20,"name":"annalyse 2","parent":12,"children":[]
"parentNodes"= [{"id":1,"name":"Grammaire"},{"id":12,"name":"Annalyse grammaticale"},{"id":20,"name":"annalyse 2"}]
}

我不想要循环解决方案，因为我已经制作了它并且我的代码错误，因为我需要克隆这个对象。

欢迎任何帮助，我知道我必须创建一个添加“路径”的递归函数，但直到现在我都失败了谢谢

【问题讨论】：

标签： javascript tree

【解决方案1】：

也许需要一些修复但工作！

 function setPath(array){
      function initPath(node,liste){
            liste.push({"id":node.id,"name":node.name});
            node["path"] = tools_clone(liste) ;
            for(var n in node.children){
                 initPath(node.children[n],tools_clone(liste));
            }
      }

      for(var i = 0; i < array.length; i++) {
            var p = [];
            initPath(array[i],p);
      }
 }

var r = convert(originals);
setPath(r);

【讨论】：