材料 ui 数据网格复选框行选择不起作用

Question

 <DataGrid
                className="list"
                pagingation
                rows={registeredClasses} 
                columns={this.getColumns()}
                pageSize={10}
                rowLength={10}
                autoHeight
                // sortModel={sortModel}
                components={{
                  pagination:CustomPagination
                }}
                checkboxSelection
                onSelectionChange={(newSelection) =>{
                  console.log(newSelection)
                }}
                
               
              />

也尝试过 onSelectionModelChange，只有当我点击行时选择才会发生，如果我点击复选框则不会发生

Answer 1

代替

onSelectionChange={(newSelection) => {
    console.log(newSelection)
}}

试试onRowSelected，像这样：

onRowSelected={(GridRowSelectedParams) => {
    console.log(GridRowSelectedParams);
}}

如果你想跟踪所有行的选择状态，你应该使用这个：

onSelectionModelChange={(GridSelectionModelChangeParams) => {
    // This will return {selections: [selected row indexes]}
    console.log(GridSelectionModelChangeParams);
    if (Array.isArray(GridSelectionModelChangeParams.selectionModel)) {
        // Iterate the selection indexes:
        GridSelectionModelChangeParams.selectionModel.forEach(
            // Get the row data:
            (selection_index) => console.log(rows[selection_index])
        );
    }
}}

我设置了一个 Code Sandbox with a working demo 供您试用