15

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>
)}
4

2 に答える 2