反应虚拟化的动态工作台高度

Question

我正在使用反应虚拟化。

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

我在行上使用了CellMeasurer来计算每行的高度。似乎react-table中的List需要一个高度来知道应该呈现的高度，所以计算新表高度的正确方法是什么？

Answer 1

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

Answer 2

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

示例：

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

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