AutoSizer の幅によって適切な値が得られるのに対し、Autosizer の高さは一貫して 0 になるため、VirtualScroll コンポーネントが表示されません。ただし、disableHeight prop を使用して VirtualScroll に高さの固定値 (つまり 200px) を指定すると、VirtualScroll は期待どおりに行を表示します。誰が何が悪いのか見ることができますか?
最終的に、Autosizer は Material-ui Dialog コンポーネント内に存在することを意図していますが、オートサイザーを単純に div にレンダリングすることも試みました。同じ問題。
render() {
return (
<Dialog
modal={false}
open={this.state.open}
onRequestClose={this.handleClose}
contentStyle={pageOptionsDialog.body}
>
<div>
<AutoSizer>
{({ width, height }) => (
<VirtualScroll
id="virtualScroll"
onRowsRendered={this.props.loadNextPage}
rowRenderer={this.rowRenderer}
height={height}
rowCount={this.props.rowCount}
rowHeight={30}
width={width}
/>
)}
</AutoSizer>
</div>
</dialog>
)}