vue 将xlsx表格转成json数据

最新推荐文章于 2024-08-13 16:09:39 发布

天高任鸟飞dyz

最新推荐文章于 2024-08-13 16:09:39 发布

阅读量716

点赞数 3

分类专栏： web前端 Vue JavaScript 文章标签： vue js

本文链接：https://blog.csdn.net/yzding1225/article/details/117995148

版权

web前端同时被 3 个专栏收录

55 篇文章 4 订阅

订阅专栏

JavaScript

28 篇文章 0 订阅

订阅专栏

Vue

24 篇文章 1 订阅

订阅专栏

一、xlsx文件

二、代码实现

HTML:

<van-uploader
  :before-read="beforeUpload"
  :accept="'application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'">
  <van-button icon="plus" type="primary">上传文件</van-button>
</van-uploader>

JS:

beforeUpload(file) {
  if (file.size / 1024 / 1024 > 5) {
    this.$message({
      message: '上传文件大于5M',
      type: 'info'
    })
    return false
  }
  return new Promise((resolve, reject) => {
    let reader = new FileReader()
    reader.onload = r => {
      let data = r.target.result
      let workbook = XLSX.read(data, { type: 'binary' })
      let worksheet = workbook.Sheets[workbook.SheetNames[0]]
      let excelData = XLSX.utils.sheet_to_json(worksheet, {
        header: ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h']
      })
      excelData.shift()
      console.log(excelData)
      resolve()
    }
    reader.readAsBinaryString(file)
  })
}