如何更改ag-grid行组缩进？

ag-grid是一个用于构建功能强大的数据表格的JavaScript库。它提供了丰富的功能和灵活的配置选项，可以满足各种数据展示需求。

要更改ag-grid行组的缩进，可以通过设置gridOptions的indentSize属性来实现。indentSize属性指定了行组的缩进级别，默认为4个空格。

以下是一个完整的示例，演示如何更改ag-grid行组的缩进：

在HTML文件中引入ag-grid的脚本文件和样式文件。

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="https://unpkg.com/ag-grid-community/dist/styles/ag-grid.css" />
    <link rel="stylesheet" href="https://unpkg.com/ag-grid-community/dist/styles/ag-theme-alpine.css" />
  </head>
  <body>
    <div id="myGrid" style="height: 500px;"></div>

    <script src="https://unpkg.com/ag-grid-community/dist/ag-grid-community.min.noStyle.js"></script>
    <script>
      // 在这里编写JavaScript代码
    </script>
  </body>
</html>

在JavaScript代码中创建一个ag-grid实例，并配置相关选项。

var gridOptions = {
  columnDefs: [
    { field: 'name' },
    { field: 'age' },
    { field: 'country', rowGroup: true }
  ],
  defaultColDef: {
    flex: 1,
    minWidth: 100,
    resizable: true
  },
  autoGroupColumnDef: {
    headerName: 'Group',
    minWidth: 200,
    cellRendererParams: {
      suppressCount: true,
      innerRenderer: function(params) {
        return '<span style="padding-left: ' + (params.node.uiLevel * 20) + 'px">' + params.data.name + '</span>';
      }
    }
  },
  rowSelection: 'single',
  groupSelectsChildren: true,
  groupDefaultExpanded: -1
};

// 模拟的示例数据
var rowData = [
  { name: 'John', age: 25, country: 'USA' },
  { name: 'Jane', age: 30, country: 'USA' },
  { name: 'Bob', age: 35, country: 'UK' },
  { name: 'Alice', age: 40, country: 'UK' },
  { name: 'Michael', age: 45, country: 'USA' },
  { name: 'Mary', age: 50, country: 'UK' }
];

// 在页面加载完成后，创建ag-grid实例并加载数据
document.addEventListener('DOMContentLoaded', function() {
  var gridDiv = document.querySelector('#myGrid');
  new agGrid.Grid(gridDiv, gridOptions);
  gridOptions.api.setRowData(rowData);
});

在上面的代码中，我们使用了autoGroupColumnDef选项来定义了行组的渲染方式。cellRendererParams中的innerRenderer定义了行组标题的显示方式，通过动态设置padding-left样式来实现缩进效果。

通过调整params.node.uiLevel乘以缩进的像素值，可以实现不同级别的缩进效果。这里使用了20px作为缩进的像素值，可以根据需要进行调整。

这是一个使用ag-grid实现行组缩进的基本示例。关于ag-grid的更多功能和配置选项，请参考官方文档：ag-Grid Documentation。