問題タブ [react-usememo]

React レンダリング/useMemo のガイダンスを探しています。

2,000 以上のアイテムのリストがあり、それぞれが React コンポーネントです。リストから独立してレンダリングされる「現在選択されている」アイテムのハイライトがあります。これにより、リストを一度だけレンダリングできます。

現在、リスト項目を「展開」する機能を追加しています。これは、展開されていない状態のリスト項目を変更することなく、新しい DOM 要素を追加するだけです。

Itemそれぞれが 2 つの部分であると想像できます。

質問: 新しい項目を展開/折りたたむたびにリスト全体を再レンダリングせずにこれをサポートする方法はありますか?

残念ながら、展開された DOM 要素は「フロー内」にあるため、展開によってリスト項目がその後にプッシュされます (ホバー/オーバーレイだけではありません)。