This recursive tree component renders the data correctly but React logs a warning and reconciliation behaves oddly when nodes are reordered. What is the underlying problem?
function Tree({ nodes }) {
return (
<ul>
{nodes.map((node, i) => (
<li key={i}>
{node.label}
{node.children && <Tree nodes={node.children} />}
</li>
))}
</ul>
);
}