前后端Excel处理篇——前端js-xlsx解析数据

遇到一个excel数据上传的需求，查阅excel上传解析的资料，比较通用的有后端POI、easyExcel等，前端为js-xlsx，考虑到后端上传的方案数据直接解析到数据库中，用户无法对从excel上传的数据进行编辑，决定采用js-xlsx前端解析的方式，这样比较灵活。

1、简介

由SheetJS出品的js-xlsx是一款非常方便的只需要纯JS即可读取和导出excel的工具库，功能强大，支持格式众多，支持xls、xlsx、ods(一种OpenOffice专有表格文件格式)等十几种格式。本文全部都是以xlsx格式为例。

官方github：github.com/SheetJS/js-…

2、js-xlsx解析excel后的对象

Excel名词：js-xlsx中的抽象类型

工作簿：workBook

工作表：Sheets

Excel引用样式(单元格地址)：cellAddress

单元格：cell

单元格对象

每一个单元格是一个对象（Cell Object）

3、主要Api

js-xlsx提供的接口非常清晰主要分为两类:

xlsx对象本身提供的功能

• 解析数据
• 导出数据

utils工具类

• 将数据添加到数据表对象上
• 将二维数组以及符合格式的对象或者HTML转为工作表对象
• 将工作簿转为另外一种数据格式
• 行,列,范围之间的转码和解码
• 工作簿操作
• 单元格操作

4、excel解析

读取excel主要是通过XLSX.read(data, {type:type});方法来实现，返回一个叫WorkBook的对象，type主要取值如下：
base64、binary``、string、buffer、array、file
这里我偷懒只用了binary，其他几种没有测试。。。

excel解析选项

excle解析代码

     //1、解析出excel格式
      this.wb = XLSX.read(data, {
        type: 'binary',
        cellNF: true,
        raw: true
      })
     //2、SheetNames以字符串数组的形式保存了所有的工作表的名称，通过XLSX.utils.sheet_to_json转化为json格式
      this.wb.SheetNames.forEach(sheetName => {
        result.push({
          sheetName: sheetName,
          sheet: XLSX.utils.sheet_to_json(this.wb.Sheets[sheetName], { raw: true })
        })
      })
      //3、中英文转换，将对应的中文key转化为自己想要的英文key
        function dateTransition(data, transitionJSON) {
          const list = []
          var obj = {}
          var outdata = JSON.parse(data)
          // 数组循环
          for (var i = 0; i < outdata.length; i++) {
            obj = {}
            // 循环一行数据中每一个对象
            for (var key in outdata[i]) {
              obj[transitionJSON[key]] = outdata[i][key]
            }
            list.push(obj)
          }
          return list
        }
复制代码

5、日期格式转换

js-xlsx在解析excel日期格式时（excel单元格的格式为自定义日期格式），会自动转换为数字格式，尝试了解析选项中的cellDates，dateNF等选项，结果还是不尽如人意，最后考虑通用性问题，采用函数方式转换为时间戳,代码如下。

    formatDate(numb) {
      const time = new Date((numb - 1) * 24 * 3600000 + 1)
      time.setYear(time.getFullYear() - 70)
      time.setMonth(time.getMonth())
      time.setHours(time.getHours() - 8)
      time.setMinutes(time.getMinutes())
      time.setMilliseconds(time.getMilliseconds())
      return time.valueOf()
    }
复制代码

总结

主要总结了使用js-xlsx解析excel的过程和一些关键点，excel导出等功能我使用的是vxe-table等库，就没有研究这方面。

参考：

www.cnblogs.com/vicky-li/p/…
www.cnblogs.com/liuxianan/p…