完全映射出未知“深度”的对象(以及寻找对象“深度”的最有效方法)

Question

我有一个“父”对象，其子对象的“深度”未知。

我的最终目标是能够完全map这个未知深度的“父”对象及其所有级别的子对象-我该如何做到这一点？

如果有帮助的话，每个子元素都已经有了与之相关联的“深度”字段。

我假设我必须首先找到“父”对象的“深度”(即它包含的最大“级别”)，对吗？最有效的方法是什么？

例如，对于下面的对象，“父”对象的最终“深度”为2。

{
    "title": "parent",
    "level": 0,
    "children": [
        {
            "title": "foo",
            "level": 1,
            "children": [],
        },
        {
            "title": "foo1",
            "level": 1,
            "children": [],
        },
        {
            "title": "foo2",
            "level": 1,
            "children": [
                {
                    "title": "foo3",
                    "level": 2,
                    "children": [],
                }
            ],
        },
    ]
}

我希望最终通过React中的map将其转换为以下内容：

<h1>parent</h1>
<h2>foo</h2>
<h2>foo1</h2>
<h2>foo2</h2>
<h3>foo3</h3>

Answer 1

看起来我实际上不需要知道深度。

根据这个答案，我可以递归地映射出这个对象：https://stackoverflow.com/a/61067404/4905992