在 ag-grid 中使用浏览器级别滚动而不是网格级别（表级别）滚动答案

【问题标题】：Use browser level scroll instead of Grid Level (table level) scroll in ag-grid在 ag-grid 中使用浏览器级别滚动而不是网格级别（表级别）滚动
【发布时间】：2019-03-06 11:21:42
【问题描述】：

我正在使用 ag-grid 来显示数据，但是在使用它时我有 2 个滚动条，一个在网格级别，另一个在浏览器级别我想将浏览器级别的滚动条用于 ag-grid。我在 ag-grid 文档中没有找到任何线索来实现这一点。

【问题讨论】：

据我所知，除非您为其容器设置非常大的高度值，否则您无法抑制 ag-grid 中的垂直滚动。但是，这最终可能会在您的页面中产生大量的负空间。我建议你调整 ag-grid 容器的高度，这样浏览器滚动条就不会出现。
你能至少添加一个页面应该是什么样子的快速模型吗？网格是你想要在页面上唯一的东西吗？

标签： angularjs reactjs ag-grid

【解决方案1】：

您可以为此使用domLayout 属性。

请参阅此示例他们如何设置domLayout = "autoHeight" 以及如何使用它：ag-grid Auto-Height

domLayout：设置为 'normal'、'autoHeight' 或 'print' 以在布局选项之间切换。默认为“正常”。

【讨论】：

autoHeight 会破坏行虚拟化，因此如果您有大量数据，请注意这一点。无限滚动也会尝试加载所有“页面”，而不是等到用户滚动到列表末尾。
@Tija - 你确定吗？检查我提供的示例链接。即使在 autoHeight 之后，行虚拟化仍然有效 - 在完成 F12 之后验证它。
我查看了开发工具中的元素选项卡，当您向右滚动时，它肯定会添加缺失的列。这是因为它知道容器的宽度，但是在渲染所有行之前它不知道容器的高度，它需要计算它来计算高度。因此，行虚拟化会中断行，它似乎也进行了所有无限滚动调用以获取我的测试中的所有数据。这个链接更详细地描述了它..ag-grid.com/javascript-grid-width-and-height/#auto-height
正确。在这里，OP 的要求是显示浏览器级别的滚动 - 而不是网格级别的滚动。在这种情况下，domLayout 很好。否则，是的，出于与性能相关的原因，这样做是不明智的。