react实现table表格导出excel表格功能

可以使用第三方库 `react-table-to-excel` 来实现表格导出功能。

首先，安装该库：

npm install react-table-to-excel

然后，在你的组件中引入它：

import ReactTableToExcel from "react-table-to-excel";

接下来，在表格组件中添加一个按钮和 `ReactTableToExcel` 组件。将 `data` 和 `columns` 作为 `ReactTableToExcel` 组件的属性传递即可。

import React, { useMemo } from "react";
import ReactTable from "react-table";
import ReactTableToExcel from "react-table-to-excel";

const Table = ({ data, columns }) => {
  const tableData = useMemo(() => data, [data]);
  const tableColumns = useMemo(() => columns, [columns]);

  return (
    <div>
      <ReactTable data={tableData} columns={tableColumns} />
      <ReactTableToExcel
        className="btn btn-primary mt-3"
        table="table-to-xls"
        filename="table"
        sheet="sheet 1"
        buttonText="导出 Excel"
      />
    </div>
  );
};

export default Table;

其中，`table` 属性为你要导出的表格的 ID，`filename` 属性为导出文件的文件名，`sheet` 属性为导出的 Excel 表格的 sheet 名称，`buttonText` 属性为导出按钮上的文本。

最后，在你的表格组件中，添加一个 ID 名为 `table-to-xls` 的 `table` 元素。

<table id="table-to-xls">
  {/* 表格内容 */}
</table>

这样，当用户点击“导出 Excel”按钮时，表格将会以 Excel 文件的形式下载到用户的本地电脑上。