mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-05 09:49:57 +08:00
72a7ba618f
* chore: update rc-table * add basic table style * checked all logic * checkbox support disabled * selection style * selection support radio * add selections support * selection extra style * select all locale * sorter logic * add more desc * init Filter hooks * init filter hooks * update style * filter style * filter style * fix filter * sort control * ajax it * add expandedable css * expandable view style * fixed style * border style * empty style * fix pagination style * add fixed demo * un-comment * clean up * fix filter check logic * fix overflow & ellipsis conflict * fix tes * adjust scroll shadow * fix border fixed style * add part of test case * add filter test part * more test case * issue related test * filter test * adjust pagination logic * fix pagination test case * all selection test case * table sorter test case * table basic test * fix test case * update faq * update expandable doc * add v4 doc * add summary docs * more demo * fix selection * update snapshot * update test case * fix ff styling * update rc-table * update snapshot * update snapshot * fix lint * fix style lint * fix style * update snapshot * update desc * fix missing icon
2.3 KiB
2.3 KiB
order | title | ||||
---|---|---|---|---|---|
4 |
|
zh-CN
通过 rowSelection.selections
自定义选择项,默认不显示下拉选项,设为 true
时显示默认选择项。
en-US
Use rowSelection.selections
custom selections, default no select dropdown, show default selections via setting to true
.
import { Table } from 'antd';
const columns = [
{
title: 'Name',
dataIndex: 'name',
},
{
title: 'Age',
dataIndex: 'age',
},
{
title: 'Address',
dataIndex: 'address',
},
];
const data = [];
for (let i = 0; i < 46; i++) {
data.push({
key: i,
name: `Edward King ${i}`,
age: 32,
address: `London, Park Lane no. ${i}`,
});
}
class App extends React.Component {
state = {
selectedRowKeys: [], // Check here to configure the default column
};
onSelectChange = selectedRowKeys => {
console.log('selectedRowKeys changed: ', selectedRowKeys);
this.setState({ selectedRowKeys });
};
render() {
const { selectedRowKeys } = this.state;
const rowSelection = {
selectedRowKeys,
onChange: this.onSelectChange,
hideDefaultSelections: true,
selections: [
Table.SELECTION_ALL,
Table.SELECTION_INVERT,
{
key: 'odd',
text: 'Select Odd Row',
onSelect: changableRowKeys => {
let newSelectedRowKeys = [];
newSelectedRowKeys = changableRowKeys.filter((key, index) => {
if (index % 2 !== 0) {
return false;
}
return true;
});
this.setState({ selectedRowKeys: newSelectedRowKeys });
},
},
{
key: 'even',
text: 'Select Even Row',
onSelect: changableRowKeys => {
let newSelectedRowKeys = [];
newSelectedRowKeys = changableRowKeys.filter((key, index) => {
if (index % 2 !== 0) {
return true;
}
return false;
});
this.setState({ selectedRowKeys: newSelectedRowKeys });
},
},
],
};
return <Table rowSelection={rowSelection} columns={columns} dataSource={data} />;
}
}
ReactDOM.render(<App />, mountNode);