1.table自定义footer,目的==>将分页功能和其它功能都放在table尾部进行展示,需要将pagination设置为false,否则会在table底部出现默认的分页
`
const renderInlineFooter = () => {
return (
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<Button
onClick={batchDeleteFun}
disabled={selectedRowKeys.length > 0 ? false : true}
>
批量删除
</Button>
<Pagination {...pagination}></Pagination>
</div>
);
};
const pagination = {
showSizeChanger: true,
showQuickJumper: true,
total,
onChange: onPageChange,
showTotal: () => `共有${total}条`,
pageSize: pageSize,
current: pageNum,
};
<Table
rowKey={(record) => record.id}
columns={columns}
rowSelection={rowSelection} //选中事件
dataSource={textList}
pagination={false}
footer={renderInlineFooter}
/>
`