通过el-upload结合xlsx获取表格数据

1.npm install xlsx --save

2.通过el-upload上传excel表格文件，代码：

 <el-upload
 	 action=""
     :before-remove="beforeRemove"
     multiple :show-file-list="false"
     tyle="display: contents" accept=".xls,.XLS,.xlsx,.XLSX"
     :limit="3"
     :on-exceed="handleExceed"
     :http-request="httpRequest">
     <el-button size="mini" style="margin-left: 10px">excel导入</el-button>
 </el-upload>

3.引入xlsx：

import XLSX from 'xlsx'

4.获取上传表格文件的数据函数：

//http-request:覆盖默认的上传行为，可以自定义上传的实现->function类型
 httpRequest (e) {
      let file = e.file // 拿到文件信息
      if (!file) {
        return false
      } else if (!/\.(xls|xlsx)$/.test(file.name.toLowerCase())) {
        // 这里格式根据自己需求定义
        this.$message.error('格式错误，请上传xls或者xlsx格式')
        return false
      }
      const fileReader = new FileReader()
      fileReader.onload = (ev) => {
        try {
          const data = ev.target.result
          const workbook = XLSX.read(data, {
            // 以字符编码方式解析
            type: 'binary'
          })
          // 获取第一张表
          console.log(workbook)
          const exlname = workbook.SheetNames[0]
          const exl = XLSX.utils.sheet_to_json(workbook.Sheets[exlname]) // 生成json表格内容
          console.log(exl)
          // 将 JSON 数据挂到 data 里
          let arr = []
          exl.forEach(item => {
            arr.push(item.name)
          })
          console.log(arr)
        } catch (e) {
          console.log('error')
          return false
        }
      }
      fileReader.readAsBinaryString(file)
    }