反应虚拟化动态表格高度

【问题标题】：react-virtualized dynamic table height反应虚拟化动态表格高度
【发布时间】：2019-06-12 15:49:30
【问题描述】：

我正在使用 react-virtualized。

我想要实现的目标：我希望表格自身的高度是动态的，这样当我的表格中添加更多行时表格的高度就会增加。

我在行上使用了 CellMeasurer 来计算每行的高度。似乎 react-table 中的 List 需要一个高度才能知道它应该渲染多少，那么计算新表高度的正确方法是什么？

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

您可以使用react-virtualized提供的WindowScroller组件中的height

例子：

<WindowScroller>
           {({ height, scrollTop}) => (
             <AutoSizer disableHeight>
                {({ width }) => (
                  <Table                   
                    autoHeight
                    height={height}
                    scrollTop={scrollTop}                    
                    width={width}
                    {...otherRequiredProps}
                  >           
                    {/* Columns here*/}
                  </Table>
                )}
              </AutoSizer>
           )}
</WindowScroller>

在上面的代码中，我也使用了AutoSizer组件来取容器宽度。

【讨论】：

【解决方案2】：

您可以按照docs 中的说明简单地指定 autoHeight 属性。

【讨论】：