仅在子行上添加组件列

import React from 'react';
import { AgGridReact } from 'ag-grid-react';
import 'ag-grid-community/dist/styles/ag-grid.css';
import 'ag-grid-community/dist/styles/ag-theme-alpine.css';

const GridExample = () => {
  const columnDefs = [
    { headerName: "ID", field: "id" },
    { headerName: "Value", field: "value" },
    {
      headerName: "Action",
      cellRendererFramework: (params) => (
        <button onClick={() => alert(`Edit ${params.data.id}`)}>Edit</button>
      ),
      colId: "action",
      cellRendererParams: {
        onClick: (data) => console.log(`Editing ${data.id}`)
      }
    }
  ];

  const rowData = [
    { id: 1, value: "Data 1" },
    { id: 2, value: "Data 2" },
    // ... more data
  ];

  return (
    <div className="ag-theme-alpine" style={{ height: 400, width: 600 }}>
      <AgGridReact
        columnDefs={columnDefs}
        rowData={rowData}
      />
    </div>
  );
};

export default GridExample;