How to get row item on checkbox selection in React MUI DataGrid?

To get row item on checkbox selection in React MUI DataGrid, we set the onSelectionModelChange prop to a function to get the selected items.

For instance, we write

const App = () => {
  //...
  return (
    <>
      <DataGrid
        rows={rows}
        onSelectionModelChange={(ids) => {
          const selectedIDs = new Set(ids);
          const selectedRowData = rows.filter((row) =>
            selectedIDs.has(row.id.toString())
          );
          console.log(selectedRowData);
        }}
      >
        ...
      </DataGrid>
    </>
  );
};

export default ThemeSelector;

to set onSelectionModelChange to a function that gets the select row IDs from the ids parameter.

Then we can get the selected rows with

const selectedRowData = rows.filter((row) =>
  selectedIDs.has(row.id.toString())
);