vue+element+xlsx实现excel数据解析

   import * as XLSX from 'xlsx';
  <el-button type="success" size="small" icon="el-icon-upload2" @click="uploadFiles">导入</el-button>
    <el-dialog
        class="dialog"
        title="批量导入"
        width="25%"
        :close-on-click-modal="false"
        :visible.sync="uploadShowDialog"
        center>
      <el-upload
          class="upload-demo"
          ref="upload"
          action="#"
          :multiple="false"
          :show-file-list="true"
          :before-upload="beforeUpload"
          :http-request="uploadHttpRequest"
          :file-list="fileList"
          :on-change="handleUploadChange"
          :limit="1"
      >
        <div class="border">
          <i class="el-icon-plus"></i>
        </div>
        <div slot="tip" class="el-upload-tip">只能上传.xls、.xlsx文件</div>
      </el-upload>
      <span slot="footer">
        <el-button @click="submitUpload" size="small" type="primary">导入</el-button>
        <el-button @click="uploadShowDialog = false" size="small" class="cancelDialog">取消</el-button>
      </span>
    </el-dialog>

       file: null,
      //加载动画
      uploadLoading: false,
      //上传的文件列表
      fileList: [],
      //控制弹出框显示与否
      uploadShowDialog: false,
      //上传地址
      uploadURL: '',
      //loading加载中
      downloadLoading: '',



  uploadFiles() {
      let that = this;
      that.uploadLoading = false;
      that.fileList = [];
      that.uploadShowDialog = true;
      // setTimeout(() => {
      //   //清空已上传的文件列表
      //   that.$refs.upload.clearFiles();
      // }, 100);
    },
    // 限制文件上传的个数只有一个，获取上传列表的最后一个
    handleUploadChange(file, fileList) {
      let that = this;
      if (fileList.length > 0) {
        // 这一步，是展示最后一次选择的文件
        that.fileList = [fileList[fileList.length - 1]];
      }
    },
    // 上传文件之前，先判断文件后缀和大小
    beforeUpload(file) {
      let that = this;
      //截取文件后缀名
      const fileName = file.name.substring(file.name.lastIndexOf('.'));
      if (
          fileName.toLowerCase() != '.xls' &&
          fileName.toLowerCase() != '.xlsx'
      ) {
        that.$message.error('文件必须为.xls或xlsx类型');
        that.fileList = [];
        return false;
      }
      //读取文件大小
      var fileSize = file.size;
      if (fileSize > 1048576) {
        that.uploadShowDialog = false;
        that.$message({
          type: 'error',
          showClose: true,
          duration: 3000,
          message: '文件不能大于1M!'
        });
        return false;
      }
    },
    // 覆盖element的默认上传文件
    uploadHttpRequest(file) {
      let that = this;
      that.file = file;
    },
    //点击确定上传按钮
    submitUpload() {
      let that = this;
      // loading加载中，通过that.downloadLoading.close()可关闭
      if (that.fileList.length === 0) {
        that.$message({
          type: 'error',
          showClose: true,
          duration: 3000,
          message: '请选择要上传的文件'
        });
        return false;
      }
      if (!!that.file.file) {
        that.downloadLoading = that.$loading({
          lock: true,
          text: '数据导入中...',
          color: '#0183FF',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.3)'
        });
        //控制台打印file，找到要上传的file，图中.raw
        //读取FILE中的数据（变为JSON格式）
        let reader = new FileReader();
        reader.readAsBinaryString(that.file.file);
        reader.onload=(e)=>{
          let data = e.target.result;
          let wb = XLSX.read(data,{type:"binary"});
          let excelName = wb.SheetNames[0];
          let ws = wb.Sheets[excelName];
          //第一行我不需要
          let result =  XLSX.utils.sheet_to_json(ws,{header:1});
          let dataArr = [];
          result.forEach((item,index)=>{
            if (index>=1){
              let obj = {
                sortnum:item[0],
                regionname:item[1],
                regioncode:item[2],
                level:item[3],
                department:item[4],
                duty:item[5],
                name:item[6],
                tel:item[7],
                phone:item[8],
                enable:item[9],
                county:item[10]
              }
              dataArr.push(obj)
            }
          })
          reportData(dataArr).then(res => {
            if (res.data.code===200){
              that.$message.success('导入成功')
              that.getDataList()
              that.downloadLoading.close();
              that.uploadShowDialog = false;
            }
          }).catch(err=>{
            console.log(err)
            that.$message.error('导入失败')
            that.downloadLoading.close();
          });
        }
      } else {
        that.downloadLoading.close();
      }
    },