mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-19 03:54:28 +08:00
40 lines
891 B
TypeScript
40 lines
891 B
TypeScript
import React from 'react';
|
|
import { Table } from 'antd';
|
|
import type { TableColumnsType, TableProps } from 'antd';
|
|
|
|
type TableRowSelection<T extends object = object> = TableProps<T>['rowSelection'];
|
|
|
|
interface DataType {
|
|
key: React.Key;
|
|
name: string;
|
|
}
|
|
|
|
const columns: TableColumnsType<DataType> = [
|
|
{
|
|
title: 'Name',
|
|
dataIndex: 'name',
|
|
},
|
|
];
|
|
|
|
const dataSource = Array.from({ length: 46 }).map<DataType>((_, i) => ({
|
|
key: i,
|
|
name: i % 2 === 0 ? `Edward King ${i}` : 'Another Row',
|
|
}));
|
|
|
|
const rowSelection: TableRowSelection<DataType> = {
|
|
renderCell: (checked, _record, index, node) => ({
|
|
props: { rowSpan: index % 2 === 0 ? 2 : 0 },
|
|
children: (
|
|
<>
|
|
{String(checked)}: {node}
|
|
</>
|
|
),
|
|
}),
|
|
};
|
|
|
|
const App: React.FC = () => (
|
|
<Table<DataType> rowSelection={rowSelection} columns={columns} dataSource={dataSource} />
|
|
);
|
|
|
|
export default App;
|