javascript - ag-grid - 数据更改时调整细节高度

Question

我有一个使用 Master/Detail 配置的表，并且正在使用 getRowHeight 回调。

高度的初始设置按预期工作。我的期望是，当表数据更新时，将重新计算包含详细信息网格的行的高度，但我似乎无法触发这些行的大小调整。

我的 getRowHeight 定义是:

getRowHeight = params => params.node.detail ? this.getDetailHeight(params) : 48;

getDetailHeight = params => {
  let rows = params.data.filterData.length;
  return rows * 48 + 116; // all rows height + (header & footer)
};

表的数据被更新(设置了 deltaRowDataMode 标志):

componentDidUpdate() {
    if (this && this.gridApi) {
      this.gridApi.setRowData(_.cloneDeep(this.props.data));
      this.gridApi.resetRowHeights();
      this.gridApi.forEachDetailGridInfo(detail => detail.api.resetRowHeights());
      this.gridApi.redrawRows(_.cloneDeep(this.props.data));
    }
  }

并且我希望根据 https://www.ag-grid.com/javascript-grid-row-height/#api-resetrowheights 调用 resetRowHeights 再次触发 getRowHeight :

api.resetRowHeights()

Call this API to have the grid clear all the row heights and work them all out again from scratch - if you provide a getRowHeight() callback, it will be called again for each row. The grid will then resize and reposition all rows again. This is the shotgun approach.

但是，我看到的行为是 getRowHeight 仅针对主行触发，不是 详细网格行(不是详细信息表中的行，而是详细信息网格行本身的高度)。

我希望这是清楚的，感谢您的任何反馈。

Answer 1

如果有人遇到同样的问题，我有适合我的情况的东西。我注意到对于细节节点，ag-grid 不会清除 resetRowHeights 上的行高，所以我更新了我的更新方法来处理这个问题:

componentDidUpdate() {
    if (this && this.gridApi) {
      this.gridApi.setRowData(_.cloneDeep(this.props.data));
      // call to resetRowHeights will apply the changes from forEachNode(..)
      this.gridApi.forEachNode(row => row.detailNode && row.detailNode.setRowHeight(null));
      this.gridApi.resetRowHeights();
      this.gridApi.redrawRows(_.cloneDeep(this.props.data));
    }
  }

这会重置详细信息节点的 rowHeight，因此 ag-grid 会重新运行 getRowHeight 调用。