2

我有一张带有 react-table v7 的表。已使用 react-window 进行虚拟化。现在表格的最后一列已修复，但我无法修复表格的最后一列。React-window 的内部元素overflow: auto最终不会让列变得粘稠。

这是重现问题的链接。

我正在尝试围绕这些方面取得一些成就。

如果您看到问题链接，我希望将最后一行固定在某个位置，并使其余行保持水平滚动。

4

3 回答 3

2

对于粘性标题，您应该按照 react-window 所说的那样实现innerElementType道具。

但是对于粘性列，可能更标准的方法是使用另一个网格或列表，并像这样同步它们的滚动位置。

你也可以使用react-base-table来实现整个侧面的粘性行和列。

于 2021-05-10T10:09:47.460 回答
1

我遇到了这个完全相同的问题。我想出了一个解决方案：

  1. 将 className 添加到 <FixedSizeList className={styles.fixedList} ...>
  2. 添加 css 以覆盖滚动： .fixedList { overflow: unset !important; }

一旦我这样做了，它就允许我的粘性列再次“粘性”。我希望这对你也有帮助。

于 2020-07-27T20:59:37.613 回答
0

粘性列和行可以通过使用提供的innerElementType属性来实现。FixedSizeListreact-window

这是一个工作示例：

https://codesandbox.io/s/dazzling-field-48x39?file=/src/App.tsx

于 2021-06-10T18:03:03.037 回答