反应虚拟化WindowsCroller滚动不起作用

Question

您对我没有正确传递道具是对的。现在我已经设置了这样的设置：

Container.jsx

<div className='container' ref={(ref) => {this.foo = ref;}}>
  this.renderContainer()
</div>
<Section scrollContainer={this.foo}/>

section.jsx(仅传递道具(

<Panel scrollContainer={this.props.scrollContainer}/>
Section.propTypes = { scrollContainer: PropTypes.object.isRequired }

panel.jsx(传递道具(

<RenderedTable scrollContainer={this.props.scrollContainer} />

renderedtable.jsx

return (
  <div className='padding-top-20 font-smoothing'>
    <WindowScroller scrollElement={this.props.scrollContainer}>
      {({ height, isScrolling, scrollTop, onChildScroll }) => (
        <AutoSizer disableHeight>
          {({ width }) => (
            <Table

不幸的是，WindowsCroller仍未调整大小。我也没有任何警告或错误。您是否使用CSS技巧来调整滚动器？我在示例中看到https://bvaughn.github.io/reeact-virtualized/#/components/windowscroller将滚动从窗口更改为滚动机体时，您可以更改flex和溢出属性。

我知道您非常忙，非常感谢您的帮助！

Answer 1

在您的示例中，您已将卷轴ref分配给this.tabsContainer，但您正在尝试以this.props.tabContainer访问它。要么这是您的错误，要么示例不完整，需要更多上下文。:)您可以提供PLNKR？