5

react-virtualizedを使用してリストの動的な高さを実現する方法については、少しわかりません。

次のようなコンポーネントがあります。

import { List } from 'react-virtualized';
<List
    height={400}
    rowCount={_.size(messages)}
    rowHeight={(index) => {
        return 100; // This needs to measure the dom.
    }}
    rowRenderer={({ key, index, style }) => <Message style={style} {...messages[index]} />}}
    width={300}
/>

リストコンポーネントで使用できると書かれているドキュメントに従ってCellMeasurerの使用を検討しましたが、この例が実際にどのように機能するかわかりません...

また、デモ コードでそれがどのように達成されたかを調べようとしましたが、行き止まりにもなりました。

各アイテムの高さを動的に取得するために DOM を測定する方法について、誰か助けてください。

4

1 に答える 1