下载安装xlsx

npm i xlsx@0.18.5

将excel文件放入public文件夹

看代码

<template>
  <el-row>
    <el-col />
  </el-row>
</template>
<script>
import axios from 'axios'
import * as XLSX from 'xlsx'
export default {
  data() {
    return {
      excelPath: `${process.env.VUE_APP_LOCAL}sys_bug_list.xlsx`,
      // 存储excel信息的数组，也就是解析完的excel数据，根据此数据渲染
      content: []
    }
  },
  created() {
    this.readExcelFile(this.excelPath)
  },
  methods: {
    readExcelFile(url) {
      axios
        .get(url, { responseType: 'arraybuffer' })
        .then((res) => {
          const data = new Uint8Array(res)
          const wb = XLSX.read(data, { type: 'array' })
          console.log(wb)
          const sheets = wb.Sheets // 获取文档数据
          this.transformSheets(sheets)
        })
        .catch((err) => {
          this.err = err
        })
    },
    transformSheets(sheets) {
      for (const key in sheets) {
        this.content.push(XLSX.utils.sheet_to_json(sheets[key]))
      }
      return this.content
    }
  }
}
</script>

📦 前端资源合集 | 持续更新

🟢 前端0到1【持续更新】→ https://pan.quark.cn/s/5df55ccff7c4

🔵 前端进阶【持续更新】→ https://pan.quark.cn/s/2dec1c87b3ec

🟣 前端2026最新【持续更新】→ https://pan.quark.cn/s/77c8fa94161c

🔴 AI最新学习资料 → https://pan.baidu.com/s/1P9X2Qk_Fby3rFNVGw_WKow?pwd=46XG 提取码：46XG

觉得有用就点个赞+收藏，关注我持续分享前端干货 💡