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

介绍

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

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

1.选用xlsx组件

    npm install xlsx --save

 

2.在页面中导入xlsx

    import *as XLSXfrom 'xlsx';

页面导入截图

3.编写相关方法

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;

    }

 };

}

4.react中组件调用

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

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

    <Button>

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

    </Button>

    </Upload>

</Form.Item>
作者：Sabertor
链接：https://www.jianshu.com/p/dfa58474cd46