将对象数组过滤到数据树中

Question

在我的reducer中，我尝试过滤对象（类别）的数组，父类别的parent: 0 ，所有其他类别的父级ID为。 类别嵌套最多3个深度。

我想将子类别存储在options数组中。 我下面有这段代码。 我找不到任何深层嵌套的选项，有什么主意吗？

        // get top level categories
        const yearCategories = action.data.filter(
            category => category.parent == 0
        );

        const categorys = yearCategories.map(({ id, name: label }) => ({
            id,
            label,
            options: action.data
                .filter(({ parent }) => parent === id)
                .map(({ id, name: label }) => ({
                    id,
                    label,
                    options: action.data
                        .filter(({ subCategory }) => subCategory === id)
                        .map(({ id, name: label }) => ({ id, label }))
                }))
        }));

示例json，来自http://wordpress.rguc.co.uk/index.php/wp-json/tribe/events/v1/categories?per_page=60&page=1

      [
{"id":1,"parent":0,"description":"","name":"Year 3"}
{"id":2,"parent":0,"description":"","name":"Year 4"}
{"id":3,"parent":0,"description":"","name":"Year 5"}
{"id":4,"parent":1,"description":"","name":"Year 3 group"}
{"id":5,"parent":1,"description":"","name":"Year 3 group"}
{"id":6,"parent":2,"description":"","name":"Year 4 group"}
{"id":7,"parent":2,"description":"","name":"Year 4 group"}
{"id":8,"parent":3,"description":"","name":"Year 5 Group"}
{"id":9,"parent":3,"description":"","name":"Year 5 Group"}
{"id":10,"parent":4,"description":"","name":"Year 3 group student"}
{"id":11,"parent":4,"description":"","name":"Year 3 group student"}
{"id":12,"parent":5,"description":"","name":"Year 3 group student"}
{"id":13,"parent":5,"description":"","name":"Year 3 group student"}
{"id":14,"parent":6,"description":"","name":"Year 4 group student"}
{"id":15,"parent":6,"description":"","name":"Year 4 group student"}
]

我想看起来像这样，例如Year 3 ：

{
  "id": 1,
    "name": "Year 3",
    "parent": 0,
  "options": [
    {
      "id": 4,
      "parent": 1,
      "name": "Year 3 group",
      "options": [
        {
          "id": 10,
          "parent": 4,
          "name": "Year 3 group student"
        },
        {
          "id": 11,
          "parent": 4,
          "name": "Year 3 group student"
        }
      ]
      },
    {
      "id": 5,
      "parent": 1,
      "name": "Year 3 group",
      "option":[]
    }
  ]}

Answer 1

您可以将一个对象作为节点的参考，并使用一个数组来存储所有父属性为零的节点，因为该节点无父。

该解决方案通过迭代所有节点一次，并在id旁边作为父节点的参考引用进行排序。 最后，以正确的顺序收集所有连接的节点。

这适用于未排序的数据，因为节点及其父级与父级及其子级之间的对象和关系。

 var data = [{ id: 1, parent: 0, description: "", name: "Year 3" }, { id: 2, parent: 0, description: "", name: "Year 4" }, { id: 3, parent: 0, description: "", name: "Year 5" }, { id: 4, parent: 1, description: "", name: "Year 3 group" }, { id: 5, parent: 1, description: "", name: "Year 3 group" }, { id: 6, parent: 2, description: "", name: "Year 4 group" }, { id: 7, parent: 2, description: "", name: "Year 4 group" }, { id: 8, parent: 3, description: "", name: "Year 5 Group" }, { id: 9, parent: 3, description: "", name: "Year 5 Group" }, { id: 10, parent: 4, description: "", name: "Year 3 group student" }, { id: 11, parent: 4, description: "", name: "Year 3 group student" }, { id: 12, parent: 5, description: "", name: "Year 3 group student" }, { id: 13, parent: 5, description: "", name: "Year 3 group student" }, { id: 14, parent: 6, description: "", name: "Year 4 group student" }, { id: 15, parent: 6, description: "", name: "Year 4 group student" }], tree = function (data, root) { var r = [], o = {}; data.forEach(function (a) { a.options = o[a.id] && o[a.id].options; o[a.id] = a; if (a.parent === root) { r.push(a); } else { o[a.parent] = o[a.parent] || {}; o[a.parent].options = o[a.parent].options || []; o[a.parent].options.push(a); } }); return r; }(data, 0); console.log(tree); 

 .as-console-wrapper { max-height: 100% !important; top: 0; }