使用具有最大宽度的 cellmeasurer 进行反应虚拟化？

Question

有什么方法可以使用具有最大列宽的 react-virtualized CellMeasurer 然后使高度扩展？

例如，我可能在网格的第一列中有一个 id 字段。这永远不会变得太大，但我想根据最大值调整它的大小。然后在第二列中我有一个文本字段，我不太确定它有多大。如果事实证明我当前的所有数据集在第二列中都有一个小值，我想根据最大值调整大小。如果它碰巧有一些较大的文本（超过一定宽度）我想使用最大宽度，然后扩展行的高度以容纳行文本。

根据我在文档和代码中看到的情况，不支持此类功能。如果是这种情况，我认为我最好的方法是使用稍微复杂一些的 _measure 函数来实现我自己的 CellMeasurer。这听起来像是正确的做法吗？

Answer 1

您应该能够通过向呈现的单元格添加样式约束来执行此操作。 CellMeasurer 仅测量浏览器报告的内容 - CSS 控制浏览器的最大宽度。

React 也可能会冻结样式对象，因此请使用 spread 而不是直接修改：

style={{
  ...style,
 maxWidth: 300
}}

使用具有最大宽度的 cellmeasurer 进行反应虚拟化？

React-Virtualized using cellmeasurer with a maximum width?

react-virtualized