将新创建的元素（带递归）附加到div - REACT.JS / JAVASCRIPT

Question

在反应中创建新元素时遇到了问题。我使用map来渲染listItem，但是一些listItems有子节点（另一个listItems）：

let list = [{id: 1, value: 'Item1'}, {id:2, value: 'Item2', childrenIds: ['3']}, {id: 3, value: 'Item3', parentId: 2}];

我需要将idI为2的listItem和id为3的listItem放在一个不同的div中，使它们成为另一个颜色背景并将它们放在一个盒子里。

我用这样的递归渲染元素：

function renderList(id, children, parentId) {
    if (children) {
        children.map(childId => {
            let item = list.find(item => item.id === childId);
            this.renderList(params);
        })
    }
    return (<List />)
}

提前致谢。