big-react
big-react copied to clipboard
fix: fix recordHostChildrenToDelete for fragment deletion
原代码中标记Fragment下需要被删除的元素时,没有考虑到Fragment嵌套的情况,会导致部分待删除元素被忽略,可用原代码运行如下组件进行复现:
function App() {
const [num, setNum] = useState(0);
return (
<ul onClick={() => setNum((prevNum) => prevNum + 1)}>
<li>a</li>
<li>b</li>
{num % 2 === 0 ? (
<>
<li>item-1</li>
<>
<li>item-2</li>
<>
<li>item-3</li>
<li>item-4</li>
</>
<li>item-5</li>
</>
<li>item</li>
</>
) : (
<li>test</li>
)}
<li>c</li>
<li>d</li>
</ul>
);
}
改进策略为:修改recordHostChildrenToDelete,通过BFS标记各层Fragment下需要删除的元素,并将recordHostChildrenToDelete与commitNestedUnmounts解耦,增强代码可读性。