ag-grid 修改 Row Group 的 Header 名称
Posted
技术标签:
【中文标题】ag-grid 修改 Row Group 的 Header 名称【英文标题】：ag-grid modify Row Group's Header name 【发布时间】：2019-06-27 11:18:43 【问题描述】：我正在使用ag-grid 来显示具有Row Grouping 的表格。
我分组的列是不可见的，因为它的值没有意义。
例如，我将有以下（完全折叠）表：
---------------------------------
| H1 H2 H3 |
----------------------------------
| > groupId1 (1) |
----------------------------------
| > groupId2 (5) |
----------------------------------
如您所见，分组是由用户不友好的 ID 完成的，这根本不会反映在列定义中。我想将groupId1 / groupId2 更改为根据组行内容动态分配的用户友好文本。
我正在使用React。
我以 ag-Grids 示例为起点，以下示例体现了我面临的问题：（例如：https://plnkr.co/edit/VM59gScPD55PhX4y4JBj?p=preview）
-
它有行分组
分组由不可见的列（国家/地区）完成
我想将国家/地区名称动态更改为从内部行的值派生的不同值。
感谢您的宝贵时间。 :)
【问题讨论】：
【参考方案1】：最后一位同事帮助了我，他的解决方案是：
valueFormatter: ( value, data ) => 'something ' + value
在我的组的colDef中，作为标题显示的值在“数据”中发送。
他说 cellRenderer 对于像这样的简单任务来说太过分了。
【讨论】：
【参考方案2】：您还可以使用这个简单的道具重命名 ag-grid 的 rowGroup 标题 autoGroupColumnDef
<AgGridReact
columnDefs=columnDefs
rowData=rowData
autoGroupColumnDef=
headerName: 'Name'
/>
【讨论】：
【参考方案3】：您可以传递有关组单元格渲染器的其他参数并像这样自定义它 -
colDef =
// set the cell renderer to 'group'
cellRenderer:'agGroupCellRenderer',
// provide extra params to the cellRenderer
cellRendererParams:
innerRenderer: myInnerRenderer, // provide an inner renderer
...
;
然后您应该能够使用myInnerRenderer 实现基于自定义逻辑显示任何文本。
这是来自 ag-grid docs 的示例。检查 Group Renderer C 实现
【讨论】：
以上是关于ag-grid 修改 Row Group 的 Header 名称的主要内容，如果未能解决你的问题，请参考以下文章