Question

如何自动调整包括auto group column在内的所有列的大小？

以下代码仅调整标准列的大小，而不调整自动组列的大小，因为this.gridColumnApi.getAllColumns()不会返回自动组列：

autoSizeAllColumns() {
  const allColumnIds = this.gridColumnApi.getAllColumns().map(c => c.colId)
  this.gridColumnApi.autoSizeColumns(allColumnIds)
},

Answer 1

您需要配置自己的自动列：

var gridOptions = {
    columnDefs: columnDefs,
    autoGroupColumnDef:{
        headerName:' autogroup',
        cellRendererParams:{
            suppressCount: true,
            checkbox:true
        }
    };

https://www.ag-grid.com/javascript-grid-grouping/#configuring-auto-column

从文档中：

如果您不满意，则可以指定组“自动列” 默认值。如果进行分组，则此列定义将作为第一列网格中的列定义。如果不分组，则此列不包括在内。

Answer 2

我能够直接使用colID（我了解的是“ ag-Grid-AutoColumn”）来调整自动组列的大小和自动调整大小。

要具体调整大小：

onGridReady:function(params)
{
    params.columnApi.setColumnWidth('ag-Grid-AutoColumn', 250);
}

要自动调整大小：

onFirstDataRendered:function(params)
{
    params.columnApi.autoSizeColumn('ag-Grid-AutoColumn');
}

Answer 3

如果要自动调整所有列（包括枢轴和组列）的大小，则需要使用getAllGridColumns()。

这是React中的样子（添加了用于忽略任何设置了supressSizeToFit属性的列的代码）：

function gridReady(params) {
  gridApi.current = params.api;
  columnApi.current = params.columnApi;
}

function autoSizeAll() {
  const colApi = columnApi.current;
  colApi.autoSizeColumns(
    colApi.getAllGridColumns().filter(column => !column.colDef.suppressSizeToFit),
  );
}

Ag-Grid自动调整大小自动列组

3 个答案: