reactjs 如何向嵌套数组的每个级别添加项

qmb5sa22  于 2022-12-03  发布在  React
关注(0)|答案(4)|浏览(165)

我有一个数组,每个对象都有无限个级别,我想根据级别添加一个id字段。级别1的ID应该是1,级别2的ID应该是2,等等。

{
    "name": "Anything2",
    "code": "SS_1",
    "levels": [
        {
            "levelName": "New level",
            "levels": [
                {
                    "levelName": "New Level2",
                    "levels": [
                        {
                            "levelName": "New Level2",
                            {
                                "levelName": "New Level2",
                                "levels": [
                                    {
                                        "levelName": "New level"
                                    }
                                ]
                            }
                        },
                        {
                            "levelName": "New Level2",
                        },
                        {
                            "levelName": "New Level2",
                        }
                    ]
                },
                {
                    "levelName": "New Level2"
                },
                {
                    "levelName": "New Level2",
                    "levels": [
                        {
                            "levelName": "New level"
                        }
                    ]
                }
            ]
        }
    ]
}

我想把上面的数组转换成下面的新数组。我试过使用for循环,但是不起作用。我没有得到预期的数据。

{
    "name": "Anything2",
    "code": "SS_1",
    "levels": [
        {
            "level": 1,
            "levelName": "New level",
            "levels": [
                {
                    "level": 2,
                    "levelName": "New Level2",
                    "levels": [
                        {
                            "level": 3,
                            "levelName": "New Level2",
                            {
                                "levelName": "New Level2",
                                "levels": [
                                    {
                                        "level": 4,
                                        "levelName": "New level"
                                    }
                                ]
                            }
                        },
                        {
                            "level": 3,
                            "levelName": "New Level2",
                        },
                        {
                            "level": 3,
                            "levelName": "New Level2",
                        }
                    ]
                },
                {
                    "level": 2,
                    "levelName": "New Level2"
                },
                {
                    "level": 2,
                    "levelName": "New Level2",
                    "levels": [
                        {
                            "level": 3,
                            "levelName": "New level"
                        }
                    ]
                }
            ]
        }
    ]
}
gkn4icbw

gkn4icbw1#

您可以采用递归方法,为每个级别提供一个递增级别。
addLevels接受一个level变量,并返回另一个函数,该函数将levels与对象分开。对象的其余部分是一个新变量。
内部函数返回一个带有level属性的新对象、一个不带levels的旧对象和一个获取嵌套数组Map的levels属性。
addLevellevel上有一个closure,它保持嵌套函数的值。
第一个

kpbwa7wx

kpbwa7wx2#

这里我把这个属性称为“深度”:

const data = {
  "name": "Anything2",
  "code": "SS_1",
  "levels": [{
    "levelName": "New level",
    "levels": [{
        "levelName": "New Level2",
        "levels": [{
            "levelName": "New Level2"
          },
          {
            "levelName": "New Level2",
            "levels": [{
              "levelName": "New level"
            }]
          },
          {
            "levelName": "New Level2"
          },
          {
            "levelName": "New Level2"
          }
        ]
      },
      {
        "levelName": "New Level2"
      },
      {
        "levelName": "New Level2",
        "levels": [{
          "levelName": "New level"
        }]
      }
    ]
  }]
};

function addleveldepth(arr, depth = 1) {
  arr.forEach(obj => {
    obj.depth = depth;
    if (obj.levels) {
      addleveldepth(obj.levels, depth + 1);
    }
  });
}

addleveldepth(data.levels);

console.log(data);
lrl1mhuk

lrl1mhuk3#

认为它有效:
第一个

wrrgggsh

wrrgggsh4#

下面是一个使用堆栈和while循环的简单解决方案。

var tree = {
  children: [{
    children: [{
      children: []
    }, {
      children: []
    }]
  }, {
    children: [{
      children: []
    }]
  }]
};

var stack = [
  [tree, 0] // `0` is the `i` below
];

var n; while (n = stack.length) {
  let [node, i] = stack[n - 1];
  if (i < node.children.length) {
    stack.push([node.children[i], 0]);
    stack[n - 1][1]++; // increment `i`
  } else {
    stack.pop();
    node.depth = n;
  }
}

console.log(tree);

相关问题