通过 ag-grid React Hook 代码示例获取所有行数据

【问题标题】：get all row data by ag-grid React Hook code example通过 ag-grid React Hook 代码示例获取所有行数据
【发布时间】：2023-02-24 10:23:20
【问题描述】：

在 Ag-Grid 的 React Hook 中：

如何创建“获取行数据”按钮
编辑后将所有行数据放入数组？
获取用户编辑/更改并更新数组

【问题讨论】：

标签： reactjs hook ag-grid-react

【解决方案1】：

如果您编辑了行数据，则可以通过cellEditingStopped 或rowEditingStarted 访问更新后的值。

const gridRef = useRef<AgGridReact>(null)

function getRowData() {
  let rowData = [];
  gridRef.current.api.forEachNode(node => rowData.push(node.data));
  return rowData;
}

return(
<>
  <button onclick={getRowData}>Get RowData</button>
  <AgGridReact
    ref={gridRef}
    onCellEditingStopped={(event: CellEditingStoppedEvent) => // You can access the updated cell value via event.newValue
    }
    onRowEditingStopped={(event: RowEditingStoppedEvent) => // You can access the updated row value via event.newValue
    }
  />
</>
)

希望这可以帮助：）

【讨论】：