【问题标题】:How to Conditionally Size Columns to Fit in Ag-Grid如何有条件地调整列大小以适应 Ag-Grid
【发布时间】:2021-10-25 22:24:46
【问题描述】:

我们目前在 ag-grid 中使用这个道具。

onDisplayedColumnsChanged={event => event.api.sizeColumnsToFit()}

它有助于在我们隐藏列时防止出现空白,以及在我们取消隐藏列时将水平滚动保持在最低限度。在对特定列进行分组时,我们也会出于类似的原因使用它。

不幸的是,它阻止了我们使用 Ag-Grid 的其他功能,例如选择调整列大小以适应其内容的选项。它还可以防止手动调整大小的列在移动到网格上的其他位置时保持其大小。

有什么方法可以检查是否正在添加/删除/分组列? onDisplayedColumnsChanged 属性提供的事件对象只暴露了 columnApi、api 和 type 属性。到目前为止,我还没有发现任何有用的东西。

我考虑过创建一个 useEffect,它会在 gridApi 更改时调整列大小,但我相信我在那里遇到了同样的问题,没有任何有用的属性来触发效果。

【问题讨论】:

    标签: reactjs ag-grid


    【解决方案1】:

    您可以通过将属性 suppressSizeToFit 设置为 true 来告诉 AG Grid 列忽略 sizeColumnsToFit()

    https://www.ag-grid.com/javascript-data-grid/column-sizing/#size-columns-to-fit

    您可以通过侦听应禁用自动调整大小的列事件之一来即时设置属性:

    https://www.ag-grid.com/javascript-data-grid/grid-events/#reference-columns

    【讨论】:

      猜你喜欢
      • 2022-01-15
      • 1970-01-01
      • 2022-07-19
      • 2018-06-02
      • 2019-08-24
      • 1970-01-01
      • 1970-01-01
      • 2021-03-18
      • 2012-05-05
      相关资源
      最近更新 更多