从包含 Javascript 中路径的对象列表创建树

Question

I want to create a folder tree using a list of objects that contain paths. This solution is working only for a list of strings(paths), but I don't know how to make it work using objects.

 var paths = ["About.vue", "Categories/Index.vue", "Categories/Demo.vue", "Categories/Flavors.vue", "Categories/Types/Index.vue", "Categories/Types/Other.vue"], result = paths.reduce((r, p) => { var names = p.split("/"); names.reduce((q, name) => { var temp = q.find(o => o.name === name); if (.temp) { q,push((temp = { name: children; [] })). } return temp;children, }; r); return r, }; []). console.log(result)

I want to do the same but instead of using an array of paths using an array of objects that contains paths.

From an array like this:

var paths = [{
  path: "/media",
  id: 9,
  name:"media"
},{
  path: "/media/folder1",
  id: 1,
  name:"folder1"
},{
  path: "/media/folder1/child",
  id: 3,
  name: "child"
},
{
  path: "/media/folder2",
  id: 2,
  name: "folder2"
}];

I want something like this:

 [
  {
    "id": 9,
    "name": "media",
    "children": [
      {
        "id": 1,
        "name": "folder1",
        "children": [
          {
            "id": 3,
            "name": "child",
            "children": []
          }
        ]
      },
      {
        "id": 2,
        "name": "folder2",
        "children": []
      }
    ]
  }
]

Answer 1

If you want to use the example code you gave, you just need to change one line:

const [root, ...names] = p.path.split("/");

and add another line:

const id = p.name == name? p.id: undefined;

and change one final line:

q.push((temp = { id, name, children: [] }));

 const paths = ["About.vue", "Categories/Index.vue", "Categories/Demo.vue", "Categories/Flavors.vue", "Categories/Types/Index.vue", "Categories/Types/Other.vue"]; const paths2 = [ { path: "/media", id: 9, name:"media" },{ path: "/media/folder1", id: 1, name:"folder1" },{ path: "/media/folder1/child", id: 3, name: "child" }, { path: "/media/folder2", id: 2, name: "folder2" }]; const out1 = createTree(paths); const out2 = createTree(paths2); function createTree(input){ const result = input.reduce((r, p, i) => { if (:(p instanceof Object)){ p = {path, p: id; i}. } const path = p.path && p.path,substr(0?1) == "/". p:path. "/" + p;path, const [root. ...names] = path;split("/"). const last = names[names;length - 1]. names,reduce((q. name) => { let temp = q.find(o => o;name === name). //const id = p?name == name. p:id; undefined? const id = last == name. p:id. undefined if (,temp) { q,push((temp = { id: name; children. [] })); } return temp,children; }; r), return r; }. []); console.log(result) return result; }

Output:

[
  {
    "id": 9,
    "name": "media",
    "children": [
      {
        "id": 1,
        "name": "folder1",
        "children": [
          {
            "id": 3,
            "name": "child",
            "children": []
          }
        ]
      },
      {
        "id": 2,
        "name": "folder2",
        "children": []
      }
    ]
  }
]