Loading

vue中上传xlsx表格文件,并获取文件json数据【前端文件上传】

import * as XLSX from "xlsx";

onMounted(
    function () {
      document.getElementById('fileInput').addEventListener('change', function () {
        const fileObj = this.files[0]
        // console.log(fileObj)

        // FileReader对象就是专门操作二进制数据的,主要用于将文件内容读入内存
        const fileReader = new FileReader()

        // readAsArrayBuffer,读取指定的 Blob或File内容
        fileReader.readAsArrayBuffer(fileObj)

        // 添加事件
        fileReader.onload = (event) => {

          // 是二进制文件
          const fileData = event.target.result

          // XLSX读取该二进制文件,获得工作簿
          const workbook = XLSX.read(fileData, {type: 'binary'})

          // 获取第一张表名称
          const sheetName = workbook.SheetNames[0]

          // 获取工作表
          const sheet = workbook.Sheets[sheetName];

          // 获取json
          const sheetJson = XLSX.utils.sheet_to_json(sheet)
          console.log(sheetJson)
        }
      })
    }
)
posted @ 2024-10-13 14:35  一只大学生  阅读(26)  评论(0编辑  收藏  举报