2

我正在使用 react-virtualized组件来同步几个固定标题的滚动——与文档ScrollSync中的示例非常相似。

我的问题:是否可以为(或其子项)提供初始scrollTop值?ScrollSync我意识到更好的方法是通过在控制滚动位置scrollToRow的组件上使用 - 为了它的价值,我正在使用它。但是因为,在垂直方向上,我只渲染一个非常高的单元格,并不能提供所需的保真度。GridscrollToColumnscrollToRow

我确实意识到这是对网格组件的轻微使用,但它作为一个水平的、无限加载的滚动条运行得非常好,同时允许我重用现有的组件。如果我可以设置一个首字母scrollTop,我会很高兴。

谢谢。

4

1 回答 1

4

不幸的是,如果没有一点破解,目前不支持这一点。

首先,hack 的原因:滚动偏移量与ScrollSync(mainGrid到 synchronized Grids) 沿一个方向流动。这意味着即使ScrollSync接受默认的左/上偏移作为道具,它们也会被 main 的第一次渲染覆盖Grid。我认为这可能是避免反应虚拟化内部丑陋的正确做法。

但是,如果您愿意,可以在这样的应用程序代码中解决它:

class YourComponent extends Component {
  render () {
    // These are arbitrary
    const defaultScrollLeft = 300
    const defaultScrollTop = 500

    return (
      <ScrollSync>
        {({ clientHeight, clientWidth, onScroll, scrollHeight, scrollLeft, scrollTop, scrollWidth }) => {
          if (!this._initialized) {
            scrollLeft = defaultScrollLeft
            scrollTop = defaultScrollTop

            this._initialized = true
          }

          return (
            <div>
              <Grid
                {...otherSyncedGridProps}
                scrollLeft={scrollLeft}
              />
              <Grid
                {...otherMainGridProps}
                onScroll={onScroll}
                scrollLeft={defaultScrollLeft}
                scrollTop={defaultScrollTop}
              />
            </div>
          )
        }}
      </ScrollSync>
    )
  }
}
于 2016-11-30T05:26:59.560 回答