我正在使用react-data-export库下载我的数据到excel.它的工作正常.但我有要求下载多个excel文件在一个点击.检查官方文档也，没有提到关于这一点.下面的代码工作正常的单个excel文件下载FYR.也有要求压缩这些excel.如果有人遇到这种情况，请恢复

import ReactExport from 'react-data-export';

const ExcelFile = ReactExport.ExcelFile;
const ExcelSheet = ReactExport.ExcelFile.ExcelSheet;
const ExcelColumn = ReactExport.ExcelFile.ExcelColumn;

const VesselReportExcelGenerator = (props) => {
    const [exportModalOpen, setExportModalOpen] = useState(false);
    const [excelData, setExcelData] = useState([]);
    const vesselReportApi = new VesselReportApi();
    const loggedInVesselName = JSON.parse(localStorage.getItem('selectedVessel'))?.name;
    var generatedData = [
        {
            columns: columns,
            data: excelData
        }
    ];

    useEffect(() => {
        fetchVesselReportFormStructure();
    }, []);

    const fetchVesselReportFormStructure = async () => {
        try {
            const vesselReportFormStructure = await vesselReportApi.getVesselReportFormStructure();
            setExcelData(vesselReportFormStructure);
        } catch (error) {
            console.log(error);
            props.setMessages([{type : "danger", message : 'Something went wrong. Please try again!'}]);
        }
    };

    return (
        <Container fluid className="VesselReportExcelBackground">
            <Col lg={7}>
                <Row style={{ justifyContent: 'center', height: '2rem',paddingTop: "40px",height: "10%" }}>
                    <div style={{fontSize: "2rem",color: config.KSTColors.MAIN,fontWeight: "900",}}>
                        OFFLINE VESSEL REPORT
                    </div>
                </Row>
                {/* Export Vessel report excel UI */}
                <Row xs={12} md={3} style={{backgroundColor: config.KSTColors.CARD_BG,height: "150px",borderRadius: "15px",marginTop: "40px"}}>
                    <Col xs={3} lg={3} style={{ padding: "0px" }}>
                        <Button className="VesselReportExcelEditButton" style={{ backgroundColor: config.KSTColors.MAIN,borderColor: config.KSTColors.MAIN,width: "100%"}} onClick={() => setExportModalOpen(true)}>
                            {/* <FontAwesomeIcon icon={faFileExport} style={{color: config.KSTColors.ICON,fontSize: "60px"}} /> */}
                            <img src={VesselExportIMG} alt="Excel Export" style={{height: "120px"}}/>
                        </Button>
                    </Col>
                    <Col xs={6} lg={6}>
                        <div style={{display: "flex",width: "100%",height: "100%",flexDirection: "column",justifyContent: "center"}}>
                            <div style={{marginTop: "5px",width: "100%",height: "50%",color: config.KSTColors.MAIN,fontSize: "32px",
                                display: "flex",justifyContent: "center",alignItems: "center"}}>
                                Download Template
                            </div>
                        </div>
                    </Col>
                </Row>
            </Col>
            <Modal size="lg" show={exportModalOpen} onHide = {() => setExportModalOpen(false)} aria-labelledby="VRTemplateDownload" centered>
                <Modal.Header style={{ backgroundColor: '#e6e6e6' }}>
                    <Modal.Title id="VRTemplateDownload">Export Vessel Report Template</Modal.Title>
                </Modal.Header>
                <Modal.Body>
                    <span style={{fontSize: "12px"}}>Are you sure to generate {loggedInVesselName} vessel report?</span>
                </Modal.Body>
                <Modal.Footer style={{ color: '#04588e' }}>
                    <Button onClick={() => setExportModalOpen(false)} style={{ backgroundColor: 'white', color: '#04588e', paddingTop: '2px', paddingBottom: '2px', paddingLeft: '20px', paddingRight: '20px' }}>Cancel</Button>
                    <ExcelFile filename={`${loggedInVesselName}_DailyLogTemplate`} element={<Tooltip title="Export Daily Log Template" placement="bottom"><Button style={{ backgroundColor: '#04588e', color: 'white', paddingTop: '2px', paddingBottom: '2px', paddingLeft: '20px', paddingRight: '20px' }}>Daily Log</Button></Tooltip>}>
                        <ExcelSheet dataSet={generatedData} name="Daily Log" />
                    </ExcelFile>
                </Modal.Footer>
            </Modal>
        </Container>
    );
};

export default withMessageManager(VesselReportExcelGenerator);