反应虚拟化 - InfiniteLoader砌体不起作用

问题描述 投票:2回答:2

我使用的反应虚拟化的砌体例子(here

和它的作品。但现在我想的InfiniteLoader添加到的例子,但我不能得到它的工作。

事情我已经尝试:

  • 不使用WindowScroller和定义自己的身高

起初我认为它会通过移除WindowScroller但loadMoreRows回调永远不会被调用工作。

另外,印度空间研究组织加载回调永远不会被调用为好。

一段代码,演示了它是如何:

<InfiniteLoader
  isRowLoaded={this._isRowLoaded}
  loadMoreRows={this._loadMoreRows}
  rowCount={myList.length}
>
  {({ onRowsRendered, isScrolling, registerChild }) => (
    <WindowScroller overscanByPixels={OVERSCAN}>
      {this._renderAutoSizer}
    </WindowScroller>
  )}
</InfiniteLoader>

从_renderAutoSizer它就像例子。没有变化。砌筑工作正常,但无法实现无限滚动。

我明白,我需要以某种方式使用onRowsRendered。但示例显示列表和网格使用。砌体没有与InfiniteLoader似乎连接的方式。

javascript reactjs memoization react-virtualized windowing
2个回答
1
投票

你可以使用onCellsRendered砌筑方法

回调调用与有关是最近呈现的细胞的信息。 ({的startIndex:号码,stopIndex:数}):无效more here时可见细胞已经改变此回调调用仅

并检查是否stopIndex === (myList.length - 1)并有多个项目,然后调用一个方法来装载更多的物品。


0
投票

this answer InfiniteLoader只适用于TableListGridInfiniteLoader docs

请注意,此组件旨在帮助行加载。因此,它是最适合用于与TableList使用(尽管它也可与Grid使用)。该组件是不与Collection组件兼容。

© www.soinside.com 2019 - 2024. All rights reserved.