反応仮想化自動サイザーでMaterial-UI ListItemをラップする方法

Question

Material-UIのListおよびListItemコンポーネントを使用していました。具体的には、ネストされたアイテムの機能を使用していました。 http://www.material-ui.com/#/components/list を参照してください。ページの途中でネストされたリストが表示されます。要点は次のとおりです。material-uiはインデントや拡大/縮小矢印などの「ネスト」の問題を処理します。

多くのアイテムを追加すると、リストが非常に遅いことがわかりました。そこで、私はAutoSizerを反応仮想化から借用しました。問題は次のとおりです：反応仮想化では、私のコードは各行に対してrowRenderer関数を提供する必要があります。ネストされたアイテムのインデントを把握する、組み込みのMaterial-UI機能を失いたくはありません。 AutoSizerを使用すると、インデントを把握するためにカスタムコードを実行する必要があるようです。また、私のコードは、展開/契約の矢印を供給するためにnnedされます。現在、マテリアルUIのList/ListItemで無料で提供されています。

ヒントやご提案はありますか？

はListItemコンポーネントがnestedLevel呼ばプロップているよう

Answer 1

が見えるありがとうございます。 material-uiドキュメントで提供された例を取ると、これを試してみてください。

しかし警告について覚えておく：：につながるはず

... 
<ListItem primaryText="Drafts" nestedLevel={3} leftIcon={<ContentDrafts />}/> 
... 

このプロパティは自動的に管理され、自己責任で変更してください。