Vue项目使用XlSX库将导入的Excel数据转化为JSON格式

革履西装

已于 2024-09-10 21:52:17 修改

阅读量1.8k

点赞数 1

分类专栏： XLSX库使用文章标签： vue

于 2022-04-09 13:37:46 首次发布

本文链接：https://blog.csdn.net/weixin_53641562/article/details/124059599

版权

XLSX库使用专栏收录该内容

1 篇文章

订阅专栏

本文介绍了如何使用JavaScript通过FileReader和xlsx库来读取上传的Excel文件，将其转换为JSON格式，并展示了关键步骤和错误处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

博主博客：www.jwblog.cn

博主开源项目：www.openapijs.com

<template>
  <div>
    <input type="file" ref="upload" @change="readExcel" accept=".xls, .xlsx" />
  </div>
</template>

<script>
import * as XLSX from 'xlsx'
export default {
  methods: {
    readExcel (e) {
      const files = e.target.files
      const fileReader = new FileReader()
      fileReader.readAsBinaryString(files[0])
      fileReader.onload = (ev) => {
        try {
          const data = ev.target.result
          const workbook = XLSX.read(data, {
            type: 'binary'
          }) // 二进制读取
          const wsname = workbook.SheetNames[0] // 取第一张表
          const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]) // 生成json表格内容
          console.log(ws)
        } catch (e) {
          return false
        }
      }
    }
  }
}
</script>