vue3中获取Excel和csv文件中的内容

原创

已于 2024-07-01 09:08:10 修改 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#excel #javascript #vue.js

于 2024-06-28 17:54:24 首次发布

1.效果

2.安装

npm install xlsx

yarn add xlsx

3.引入使用

<el-upload ref="uploadRef" :on-change="changeFile" :show-file-list="false" class="mr10" accept=".csv, .xlsx, .xls"
  action="#" :auto-upload="false">
  <template #trigger>
    <el-button type="primary">选择文件</el-button>
  </template>
</el-upload>

import * as XLSX from "xlsx"

// csv/excel 选择文件
const changeFile = async (file) => {
    // const file = file.file;
    // 创建文件读取对象 用于读取file 和 blob
    const fileReader = new FileReader();
    let sheetObj = []
    // 读取文件到二进制 异步读取 配合 readAsBinaryString(file) 函数一起使用