在 React 中以 excel 格式导出数据

如何解决在 React 中以 excel 格式导出数据

我已经设法以 csv 格式导出数据，但我很难以 xls/xlsx/excel 格式导出。

有 2 个单选按钮用于将状态值从 csv 更改为 xls 并返回，并且基于该值，三元知道应该使用哪种格式进行导出。

csv 部分工作正常，但我不知道要写什么才能进行 xls 导出。

必须在这个三元运算符的第二部分添加一些东西：

{data.exportType === 'csv' ? (
  <CSVLink {...csvReport}>export CSV</CSVLink>
) : (
  <div>export XLS</div>
)}

这是组件：

import React,{ useState } from 'react';
import { useSelector,shallowEqual } from 'react-redux';
import { OutlineButton,RadioButton } from '@thermofisher/react-komodo-design';
import './style.scss';
import { CSVLink } from 'react-csv';

const ExportOrders = () => {
  const initialData = {
    exportType: 'xls',page: 0
  };
  const [data,setData] = useState(initialData);

  const orders = useSelector(
    (state) => state.deferredPayments.orderLines,shallowEqual
  );

  const csvReport = {
    data: orders,filename: 'result.csv'
  };

  const onChangeHandler = (e,type) => {
    const name = e.target.name;

    setData({
      ...data,[name]: type
    });
  };

  const handleSubmit = (e) => {
    e.preventDefault();
  };

  return (
    <form onSubmit={handleSubmit} className="export-container">
      <div className="c-radio-container">
        <RadioButton
          name="exportType"
          checkedValue={data.exportType}
          value="xls"
          onChange={(e) => onChangeHandler(e,'xls')}
          inline>
          XLS
        </RadioButton>
        <RadioButton
          name="exportType"
          checkedValue={data.exportType}
          value="csv"
          onChange={(e) => onChangeHandler(e,'csv')}
          inline>
          CSV
        </RadioButton>
      </div>

      <OutlineButton>
        {data.exportType === 'csv' ? (
          <CSVLink {...csvReport}>export CSV</CSVLink>
        ) : (
          <div>export XLS</div>
        )}
      </OutlineButton>
    </form>
  );
};

export default ExportOrders;

有什么想法吗？