如何在 react-data-grid 的行选择中禁用一行的复选框
How to disable checkbox for a row in rowselection in react-data-grid
<ReactDataGrid
columns={[
{ key: 'time', name: 'time', width: 140, formatter: (props) => (<span>{props.value}</span>), sortable: true },
{ key: 'Size', name: 'Size', width: 80, formatter: (props) => (<span>{props.value}</span>) },
{ key: 'qaw', name: 'dash Value', width: 350 },
]}
rowGetter={this.rowGetter}
rowsCount={list.length}
emptyRowsView={() => (<div />)}
rowSelection={{
showCheckbox: true,
onRowsSelected: this.onVersionRowsSelect,
onRowsDeselected: this.onVersionRowsDeselect,
selectBy: {
indexes: this.state.selectedIndexes
}
}}
/>
以上是我的react-data-grid代码。
我想在某些情况下禁用特定行的行选择,或者想禁用该特定行的复选框。
请告诉我如何实现。
谢谢
您可以通过执行以下操作来禁用行的选择:-
onVersionRowsSelect(rows) {
rows = rows.filter(item => !item.row.isSnapshotQuarantined)
this.setState({
selectedIndexes: this.state.selectedIndexes.concat(rows.map(r => r.rowIdx))
});
}
我不确定您是否可以更改禁用复选框的视觉效果,因为复选框 html 的控件未被 react-data-grid
公开(据我所知)。
希望对您有所帮助。
<ReactDataGrid
columns={[
{ key: 'time', name: 'time', width: 140, formatter: (props) => (<span>{props.value}</span>), sortable: true },
{ key: 'Size', name: 'Size', width: 80, formatter: (props) => (<span>{props.value}</span>) },
{ key: 'qaw', name: 'dash Value', width: 350 },
]}
rowGetter={this.rowGetter}
rowsCount={list.length}
emptyRowsView={() => (<div />)}
rowSelection={{
showCheckbox: true,
onRowsSelected: this.onVersionRowsSelect,
onRowsDeselected: this.onVersionRowsDeselect,
selectBy: {
indexes: this.state.selectedIndexes
}
}}
/>
以上是我的react-data-grid代码。 我想在某些情况下禁用特定行的行选择,或者想禁用该特定行的复选框。
请告诉我如何实现。 谢谢
您可以通过执行以下操作来禁用行的选择:-
onVersionRowsSelect(rows) {
rows = rows.filter(item => !item.row.isSnapshotQuarantined)
this.setState({
selectedIndexes: this.state.selectedIndexes.concat(rows.map(r => r.rowIdx))
});
}
我不确定您是否可以更改禁用复选框的视觉效果,因为复选框 html 的控件未被 react-data-grid
公开(据我所知)。
希望对您有所帮助。