用官方提供的方法rowSelection代碼如下:
const rowSelection = {
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
<Table
columns={columns}
rowSelection={rowSelection}
rowKey={record =>record.id} //這一個一定要選
dataSource={this.state.tableData}
pagination={false}
/>
注意:上面這種方法是我從官網copy下來的但是會有一個潛在的bug,就是選中後再次進來頁面不能清除上一次選中的緩存,我的前兩篇文章會有介紹,下面具體又複製了另一種方法,代碼如下:
state={
selectedRowKeys:[ ],
}
const {selectedRowKeys } = this.state;
const rowSelection = {
selectedRowKeys,
onChange: (selectedRowKeys) => {
this.setState({
selectedRowIds : selectedRowKeys.map(Number),
selectedRowKeys
})
},
};
//這種方法如果清楚緩存的時候只需要清楚掉selectedRowKeys爲空即可。