使用子表格继续展示父级表格的数据：
、、子级数据
const menu = (
<Menu>
<Menu.Item>Action 1</Menu.Item>
<Menu.Item>Action 2</Menu.Item>
</Menu>
);
const expandedRowRender = (columnsa) => {
console.log(columnsa)
const columns = [
{ title: '路线编号', dataIndex: 'pid', key: 'pid' },
{ title: '开始时间', dataIndex: 'dateBegin', key: 'dateBegin' },
{ title: '结束时间', dataIndex: 'dateEnd', key: 'dateEnd' },
{ title: '线路类型', dataIndex: 'trackType', key: 'trackType' },
{
title: '线路状态',
key: 'state',
render: () => (
<span>
<Badge status="success" />
已规划
</span>
),
},
{ title: '工作次数', dataIndex: 'twNum', key: 'twNum' },
{
title: 'Action',
dataIndex: 'operation',
key: 'operation',
render: () => (
<Space size="middle">
<Dropdown overlay={menu}>
<a>
More <DownOutlined />
</a>
</Dropdown>
</Space>
),
},
];
const data = [];
data.push(columnsa);
// for (let i = 0; i < 3; ++i) {
// data.push({
// key: i,
// date: '2014-12-24 23:12:00',
// name: 'This is production name',
// upgradeNum: 'Upgraded: 56',
// });
// }
return <Table columns={columns} dataSource={data} pagination={false} />;
};
//父级数据
const columnsa = [
{ title: '任务名称', dataIndex: 'name', key: 'name' },
{ title: '任务编号', dataIndex: 'tid', key: 'tid' },
{ title: '创建时间', dataIndex: 'dateAdd', key: 'dateAdd' },
{ title: '任务级别', dataIndex: 'class', key: 'class' },
{ title: '任务类别', dataIndex: 'tsType', key: 'tsType' },
{ title: '责任人', dataIndex: 'personName', key: 'personName' },
{
title: 'Status',
key: 'state',
render: () => (
<span>
<Badge status="success" />
已完成
</span>
),
},
{ title: '操作', key: 'operation', render: () => <a>领取</a> },
];
表格部分：
<Table
className="taskData"
columns={columnsa}
expandable={{ expandedRowRender }}
dataSource={data}
/>