Followed the example but once I update the line onRowSelectionChange: setRowSelection,
the checkboxes do not get checked once I click on them.
Not sure if it’s a re-render issue with the rowSelection not being passed back to the table properly.
This is pretty much exactly from the example but the checkboxes do not get checked when I click on them. But if I remove onRowSelectionChange: setRowSelection
then the issue goes away.
type TableProps<T extends MRT_RowData> = {
tablePropsObj: MRT_TableOptions<T>;
};
const Table = <T extends MRT_RowData>(props: TableProps<T>) => {
const [pagination, setPagination] = useState({
pageIndex: 0,
pageSize: 10,
});
const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});
const updatedTablePropsObj: MRT_TableOptions<T> = {
enableColumnActions: false,
enableRowSelection: true,
enableSelectAll: true,
enableTopToolbar: true,
enableToolbarInternalActions: true,
enableBottomToolbar: true,
enablePagination: true,
manualPagination: true,
manualFiltering: true,
positionPagination: 'bottom',
onPaginationChange: setPagination,
onRowSelectionChange: setRowSelection,
state: {
pagination,
rowSelection,
},
}
const table = useMaterialReactTable(updatedTablePropsObj);
return (
<>
<MaterialReactTable table={table} />
</>
);
};