避免使用网格组件和网站标题的双滚动条

【问题标题】：Avoiding double scrollbars with Grid Component and a website header避免使用网格组件和网站标题的双滚动条
【发布时间】：2017-01-03 23:09:18
【问题描述】：

我正在尝试向我的网站添加一个使用 <Grid> 组件的网站标题。如何嵌套网站标题以避免获取浏览器滚动条和<Grid> 滚动条？

我想将网格向下推以允许网站标题，同时允许窗口/浏览器控制两者的滚动。

我正在使用这些组件 <WindowScroller><AutoSizer><Grid>

我在 https://bvaughn.github.io/react-virtualized/ 上看到 WindowScroller 可以正常工作（使用 VirtualScroll 组件）。

【问题讨论】：

标签： react-virtualized

【解决方案1】：

确保您在内部 Grid 上指定了 autoHeight 属性。这个属性告诉它溢出而不是滚动。

所以你想要这样的东西：

<WindowScroller>
  {({ height, isScrolling, scrollTop }) => (
    <AutoSizer disableHeight>
      {({ width }) => (
        <Grid
          autoHeight
          height={height}
          rowRenderer={({ index }) => this._rowRenderer({ index, isScrolling })}
          scrollTop={scrollTop}
          width={width}
          {..otherProps}
        />
      )}
    </AutoSizer>
  )}
</WindowScroller>

【讨论】：

完美 - 我在测试中也遗漏了 scrollTop 参数。没有有意义的东西，它似乎不起作用。
太棒了。 :) 很高兴听到！