获取 AgGrid 中单元格内的整行数据

Question

我使用的是AgGridReact，但这是一个关于如何使用AgGrid在该行的单元格中获取整行数据的一般问题。

我正在为某个单元格(其字段为id(使用自定义单元格渲染器，在该单元格中，我需要获取整行的数据，而不仅仅是id字段的数据。

网格就是这样定义的：

<AgGridReact
rowData={users}
frameworkComponents={{
idRenderer: IdRenderer,
}}
>
<AgGridColumn field="id" cellRenderer="idRenderer"></AgGridColumn>
<AgGridColumn field="name"></AgGridColumn>
<AgGridColumn field="phone"></AgGridColumn>
<AgGridColumn field="email"></AgGridColumn>
</AgGridReact>

以下是IdRender组件(用于自定义id字段单元格的外观(，我需要从中获取行的数据：

import { useEffect } from 'react';
function IdRenderer(props) {
// the following currently stores the cell's value in `rowData`
const rowData = props.valueFormatted ? props.valueFormatted : props.value;
useEffect(() => {
console.log(rowData);  // get the entire row's data here instead of just this cell's value
}, [])
return (
<>
{/* some components */}
</>
);
}
export default IdRenderer;

我无法从文档中找出应该向网格或单元格渲染器添加什么，以便能够在id字段的单元格中获取整行的数据(单击按钮后，我将在其中向API发布数据(。

Answer 1

在对文档进行了长时间的挖掘之后，我终于找到了实现这一点的方法：使用valueGetter。我决定发布这个问答；A帮助他人找出如何实现同样的目标。

只需为行的数据定义以下值getter：

const rowDataGetter = function (params) {
return params.data;
};

并通过设置valueGetter道具在AgGridColumn上使用：

<AgGridColumn field="id" cellRenderer="idRenderer" valueGetter={rowDataGetter}></AgGridColumn>

现在IdRenderer中的rowData将包含整行的数据，而不是单元格值。