React项目，基于antd读取excel文件

Posted 2023-03-09

参考技术A SheetJS js-xlsx 是一款能够读写多种格式表格的插件，浏览器支持良好，并且能在多个语言平台上使用

GitHub地址 GitHub - SheetJS/js-xlsx: SheetJS Community Edition -- Spreadsheet Toolkit

    npm install xlsx --save

    如果安装失败，删除package.lock文件，再执行npm相关命令。

    import *as XLSXfrom 'xlsx';

onImportExcel = file =>

        let data = [];// 存储获取到的数据

        // 通过FileReader对象读取文件

      const fileReader =new FileReader();

      fileReader.readAsBinaryString(file);  //二进制

      fileReader.onload = event =>

     try

                    const result = event.target;

                // 以二进制流方式读取得到整份excel表格对象

                  const workbook = XLSX.read(result, type:'binary' );

                // 遍历每张工作表进行读取（这里默认只读取第一张表）

                 for (const sheet in workbook.Sheets)

                    if (workbook.Sheets.hasOwnProperty(sheet))

                        // 利用 sheet_to_json 方法将 excel 转成 json 数据

                      data =data.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));

                    // break; // 如果只取第一张表，就取消注释这行

       



    console.log(data);

    catch (e)

// 这里可以抛出文件类型错误不正确的相关提示

      console.log('文件类型不正确');

      return;

    

 ;



<Form.Item label="报表上传">

    <Upload name="excel" action="" listType="text"  accept="file" beforeUpload=this.onImportExcel     showUploadList=true>

    <Button>

        <Icon type="upload" />点击上传报表

    </Button>

    </Upload>

</Form.Item>