AG Grid列分组功能失效求助（React环境）

核心原因 #

你已安装ag-grid-enterprise依赖，但未在项目中正确引入并激活企业版功能，导致控制台提示rowGroup仅支持企业版。

具体解决步骤 #

1. 确认依赖版本完全匹配 #

保证ag-grid-react、ag-grid-community和ag-grid-enterprise的版本统一为v25.3.0，版本不兼容会直接导致功能失效。查看package.json：

"dependencies": {
  "ag-grid-react": "25.3.0",
  "ag-grid-community": "25.3.0",
  "ag-grid-enterprise": "25.3.0"
}

若版本不一致，重新安装对应版本：

npm install ag-grid-react@25.3.0 ag-grid-community@25.3.0 ag-grid-enterprise@25.3.0

2. 在组件中引入激活企业版 #

在使用AG Grid的React组件文件顶部，添加以下代码：

import 'ag-grid-enterprise';

这行代码会自动激活AG Grid的企业版特性，包括rowGroup分组、透视表等高级功能。

3. 检查列配置正确性 #

确保rowGroup: true的写法无误，示例配置如下：

const columnDefs = [
  { field: 'athlete', rowGroup: true, hide: true }, // 隐藏原列，仅显示分组行
  { field: 'country', rowGroup: true, hide: true },
  { field: 'year' },
  { field: 'gold' },
  { field: 'silver' },
  { field: 'bronze' }
];

注：若不需要显示原始athlete、country列，建议添加hide: true避免重复内容。

4. 确认Grid组件配置正常 #

检查AG Grid组件属性，确保分组功能默认启用（v25.3.0默认支持，也可显式配置）：

<AgGridReact
  columnDefs={columnDefs}
  rowData={rowData}
  autoGroupColumnDef={{
    headerName: '分组',
    minWidth: 250
  }} // 自定义分组列的显示样式
  animateRows={true}
/>

常见排查点 #

• 若仍报错，检查是否构建时tree-shaking剔除了ag-grid-enterprise代码，可尝试在项目入口文件（如index.js/App.js）全局引入一次import 'ag-grid-enterprise'
• 确认AG Grid配置中没有suppressEnterpriseFeatures: true，若有则删除该配置

内容的提问来源于stack exchange，提问作者Raj