问题标签 [react-virtualized]

我是新手React Virtualized，对我的英语感到抱歉。这是我的代码笔链接：http ://codepen.io/anon/pen/xqGXwv?editors=0010 ，当我滚动到第 4 个 div 时，它在闪烁，有人可以帮我吗？

我从 react-virtualized 8.11 --> 9.1 升级，并收到上述错误。考虑文档的重大更改：

1-我正在使用 React 版本 0.15.X

2- 我没有使用 CellMeasurer 组件。

除了上述之外，你们中的任何人有没有经历过升级到 react-virtualized 9 的重大变化？升级时我没有做其他更改。

VirtualizedTable.js

表容器.js

我正在使用一个InfiniteLoaderwith aTable并且我有一些条目的索引匹配存储在 state 中的特定条件。如果用户想要浏览这些条目，我将不得不向下传递给Table每个索引（单击按钮后）并在scrollToIndex. 但是，在它传递下来之后，我将不得不null再次制作它，否则如果用户要向上/向下滚动Table，他将始终以由 指定的相同索引结束，scrollToIndex而不是当前滚动位置。

有没有更好的方法来做到这一点，除了两次设置状态，一次使用索引，然后使用null值？

希望我的问题很清楚。

有没有办法使用CellMeasurer具有最大列宽的反应虚拟化，然后使高度扩大？

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

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

我问是因为我看到的例子都在 es6 类中。

并且：我将我的 es6 类重构为一个功能组件。现在不再出现任何行。而且也没有错误。似乎行渲染器不再渲染任何行。

我可能正在尝试做一些不受支持的事情，但我正在尝试将 react-virtualized 的 CellMeasurer 与 MultiGrid 一起使用。我还使用 aScrollSync来检测用户何时一直向右滚动并显示/隐藏指示器。

需要注意的是，我有一个选项卡控件来操作哪些数据（行和列）。当数据发生变化时，我在我的 redux 存储中设置了一个标志，并使用它来重新测量我的单元格。

它的工作方式与我的预期非常接近。我第一次进入新标签时，除了两个例外，所有单元格都被正确测量。

1）第一列（1个固定列）重新测量，但左上角和左下角网格的宽度不更新。这会在新尺寸和默认尺寸之间留下一个差距。一旦我滚动，它就会自行修复 - 很确定，因为我有 ScrollSync。

滚动前 滚动 后

2) 列索引 1 永远不会小于默认宽度。这是第一个非固定列。 适用于更大的内容：

然后，主要问题是当我返回之前已经显示的选项卡时。发生这种情况时，即使我的新数据标志仍在触发重新测量，上一个选项卡中存在的列中的测量值也会继续存在。我认为我需要清除缓存，但到目前为止我的尝试已导致所有列都变为默认宽度。是否有一定的 , 序列，CellMeasurerCache.clearAll这对我来说可以正常工作吗？MultiGrid.measureAllCellsMultiGrid.recomputeGridSize

使成为

单元格渲染器

组件生命周期

编辑 这是一个 plunker。这个例子展示了我所解释的大部分内容。它也给行提供了比预期更高的高度（无法分辨与我的其他实现有什么不同）

我正在构建一个 React 应用程序，我有多个Grid组件，并结合了ScrollSync，如下所示：

它看起来像这样：

他们正在正确滚动，一个正在跟随另一个。但是，我需要 GRID 1 始终在 DOM 中完全呈现。

Grid 的overscanRowCount选项没有帮助，因为它只给了我 n 行，但只在滚动方向上。

例如，如果我渲染了 10 行，并且我设置overscanRowCount为 6 - 如果我向下滚动，我将有 10 + 底部 6 行，如果我滚动到顶部，我将有 10 + 6 顶部行。

为什么我需要它？我的应用程序如下所示：

因此，当例如“prod5”项目离开 DOM 时，那条蓝线也会丢失，每一行都是从行项目到顶部。

对我来说，一个好的选择是渲染 n 顶行和底行，或者简单地 - 全部渲染。任何解决方案或解决方法？我搜索了很多，找不到任何有用的东西。

我正在尝试测试反应虚拟化。我使用了download-zip文件。当我npm start在 react-virtualized-master 中运行时，它不会呈现任何具有以下错误的内容。任何人都可以帮助修复这个错误吗？

反应错误：

react-virtualized 如何与普通 reactJs 不同。任何人都可以用一个例子来解释我吗？

提前致谢。

我刚刚在我的项目中集成了 react-virtualized。我使用的代码与他们在表格演示中使用的代码相同。

https://github.com/bvaughn/react-virtualized/blob/master/source/Table/Table.example.js

进行一项更改 - 而不是从

我使用了我的虚拟数据列表。

列表视图.jsx：

我在另一个组件中包含了 listview.jsx -

mainComponent.jsx

而已。但是我的桌子不来了。总是遇到同样的错误，

类型错误：_reactVirtualized2.default 未定义

如果我扩大错误然后 -

请帮忙 ！