问题标签 [react-virtualized]

我有一个 React Virtualized InfiniteList/Grid 组合，遵循文档中的基本模式（https://github.com/bvaughn/react-virtualized/blob/master/docs/InfiniteLoader.md#infiniteloader-and-grid） .

它工作得很好，除了两件事：

• 如果我滚动得太快，而不是等待事情赶上，它会将滚动重置到网格的顶部

• 该组合仅获取前 N 个结果（例如 125）......即使我有 859 个结果（即使我提供了 859 作为rowCount道具）

  • 这特别奇怪，因为它以 25 为增量获取，所以这意味着前 5 次一切正常，然后在第 6 次莫名其妙地失败。

我已经尽我所能弄清楚发生了什么，即使我用console.loganddebugger语句填充 React Virtualized 代码，我仍然无法弄清楚为什么它会在 125 个结果处停止（或者为什么快速滚动重置）。

任何更熟悉 React Virtualized 的人都可以将我指向代码中决定是继续获取​​还是停止（并可能将开始索引重置为 0）的位置？我可以说涉及到 InfiniteScrollonRowsRendered和scanForUnloadedRangesGrid onSectionRendered，但我仍然无法弄清楚值处理在哪里停止以及实际的“决定是否继续”逻辑开始。

我有以下示例InfiniteLoader使用Table. 问题是loadMoreRows在加载或安装组件时不会调用它。但是，如果我手动执行 API 调用并通过 , 传递结果props，loadMoreRows则使用 startIndex 0 调用，因此我有两次相同的 API 调用。

我有以下示例实现InfiniteLoaderwith a Table，它将 设置Table rowCount为已知的大数（数据库中的日志计数）和InfiniteLoader rowCount我获取的一批日志的大小。我需要这个，以便用户知道基于滚动高度有多少数据。否则，他将不得不滚动到最后，看看是否加载了更多日志。可能是我滥用了这两个rowCount道具，但是每当我快速滚动到接近末尾的索引时，尚未加载数据的位置，data在函数中是未定义的getRowClassName。我认为loadMoreRows在这种情况下会被调用。

我有一个从 React Virtualized 构建的无限滚动组件InfiniteLoader我有一个由 React Virtualized和Grid组件。如果我使用鼠标滚轮向下滚动（即相当缓慢），一切都会很好。但是，当我单击组件内的滚动条并将其向下拖动（移动得更快）时，我从未将其拖到底部。相反，在向下滚动一定百分比后，滚动条突然跳回顶部。

我尝试在 中添加console.log语句Grid，但它们所显示的只是event.target.scrollTop从一个非常高的时刻到0下一个时刻。我不明白的是为什么event.target.scrollTop突然变成0当我在浏览器中所做的所有事情都是向下移动鼠标（同时按住左键）时

有谁知道我该如何解决，甚至只是调试这个问题？

抱歉，如果标题有些误导。我正在使用InfiniteLoadera Table，问题是我要加载的数据总数几乎总是巨大的。如果每次loadMoreRows调用时都附加数据，我最终会在状态中存储超过 100000 个条目，我认为这对性能不利。

我想知道是否可以不每次都附加数据。我尝试仅将日志和状态设置为仅从 to 加载startIndex，stopIndex但每次滚动loadMoreRows都会被多次调用。

这是我到目前为止所拥有的，如上所述我尝试过的

这里是loadMoreRows从父组件传下来的

我想知道将虚拟化与动画过滤相结合是否可行，例如 mixtitup 提供的内容：https ://www.kunkalabs.com/mixitup/

我们的想法是呈现很多项目（比如说 30K 图像来表示），将它们虚拟化，并拥有像 mixitup 这样的库的漂亮和流畅的过滤动画。

非常感谢！

在下面的代码片段中，有四个 div，每个 33 个字符。根据宽度和自动换行，div 可以占用一、二或三行。什么是事先计算的好方法？

我需要这个的原因是因为我使用了一个 React List 组件（https://bvaughn.github.io/react-virtualized/#/components/List），它接受列表项或函数高度的固定值根据索引计算列表项的高度。使用该索引，我可以检索将在 div 中的文本并使用 JavaScript 获取列表的宽度。从这些变量中，我有望计算出合适的高度。

当没有行索引的概念来获取行数据时，是否可以使用 React Virtualized？

我想使用 React Virtualized 来显示来自不断修改的大型（100k+ 行）数据库表的数据：在表中的随机位置添加/删除/更新行。

我没有可以通过使用行索引来获取行的函数，因为每行的位置每隔几秒就会改变一次。

表格是排序的，保证每一行都有唯一的内容，所以我有以下功能：

getFirst/LastRow() => data：获取（当前）第一行/最后一行的数据内容

getNext/PreviousRows(startData, nrRows) => data[]：获取（当前）下一个/上一个的数据内容nrRows，从内容行开始startData

findRow(data) => data: 找到有内容的行data

我还有一个实时跟踪表突变的观察者函数，因此我可以为表的每个插入/删除/更新操作获取回调。

有没有办法将这些可用功能映射到可行的 React Virtualized 配置？

我正在使用 react-virtualized向导为我正在使用的东西生成一个起点。基本上我只点击了“你的集合会有多于 1 行数据吗？”，这给了你这个：

然而，在用我自己的方法替换cellRenderer和之后，变量返回为. 发生了什么对我来说有点模糊，但是 List 立即抛出一个错误，因为它没有将任何东西传递给 rowHeight 道具。rowRenderergetRowHeightundefined

我在类似的设置中使用 React Virtualized，如下面的片段。有几个项目是使用CellMeasurer. 最后一项表示将加载更多项，并且不会正常渲染。这个项目有错误的位置/样式和与之相关的错误高度。我怎样才能解决这个问题？

如果你想玩它，这里有一个 Plunkr： https ://plnkr.co/edit/TrKdNu4FfNsXqERPVnYo?p=preview