如何在 AntD 分页中添加自定义 Button 来下载报表？

【问题标题】：How to add a custom Button in AntD pagination to download a report?如何在 AntD 分页中添加自定义 Button 来下载报表？
【发布时间】：2021-07-04 14:14:39
【问题描述】：

我想在分页中添加下载按钮，并且我想允许将表格数据下载为 excel 文件。是否可以在 Antd 分页中添加和渲染自定义按钮。在这里，我附上了一张图片来显示我要归档的内容。

【问题讨论】：

标签： reactjs pagination antd

【解决方案1】：

您可以使用showTotal 的分页道具，如下所示：

import { Pagination, Button } from "antd";
import DownloadOutlined from "@ant-design/icons/DownloadOutlined";

// render Pagination
<Pagination
  total={25}
  showSizeChanger
  showTotal={(total) => (
    <div>
      {`Total ${total} items`}
      <Button
        type="primary"
        icon={<DownloadOutlined />}
        style={{ marginLeft: 8 }}
      />
    </div>
  )}
/>

【讨论】：