class User extends Interval {
constructor(props) {
super(props);
this.state = {
synCode: [],
}
}
render() {
console.log(this.state.synCode);
const _this = this;
const rowSelection = {
getCheckboxProps(record) {
return {
defaultChecked: record.leader === 1, // 配置默认勾选的列 (Bealean)
};
},
onChange(selectedRowKeys) {
console.log('新来的',selectedRowKeys);
// console.log('原来的',_this.state.synCode);
_this.setState({synCode: selectedRowKeys})
},
};
return (
<Table rowKey={record => record.id} rowSelection={rowSelection} columns={columns} dataSource={this.state.data} />
);
}
}
在 <Table/> 组件中有 rowSelection={rowSelection} 方法,可以让Table的第一列成为联动的选择框。
API中说到通过 rowSelection.selectedRowKeys 来控制选中项。比较坑的是,selectedRowKeys 控制的只是dataSource当前的顺序编号。
一定要加上rowKey="id"或者rowKey={record => record.id},后来经过多次调试发现很多BUG都跟这个参数有关,不然会导致联动的选择框状态异常。id可以自定义为dataSource中的某个值。
————————————————
版权声明:本文为CSDN博主「永不消失的彩虹」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/xlszzck/article/details/82462699