vue 前端读取Excel文件并解析

在Vue前端项目中，可以使用第三方库xlsx来读取和解析Excel文件。以下是一个简单的例子：

1. 首先，安装xlsx库：

npm install xlsx

2. 然后，在Vue组件中使用这个库来读取和解析Excel文件：

<template>
  <div>
    <input type="file" @change="handleFileUpload" />
  </div>
</template>
 
<script>
import * as XLSX from 'xlsx';
 
export default {
  methods: {
    handleFileUpload(event) {
      const file = event.target.files[0];
      const reader = new FileReader();
      reader.onload = (e) => {
        const data = new Uint8Array(e.target.result);
        const workbook = XLSX.read(data, { type: 'array' });
        const firstSheetName = workbook.SheetNames[0];
        const worksheet = workbook.Sheets[firstSheetName];
        const jsonData = XLSX.utils.sheet_to_json(worksheet, { header: 1 });
        console.log(jsonData);
      };
      reader.readAsArrayBuffer(file);
    }
  }
};
</script>

在这个例子中，我们定义了一个方法handleFileUpload，它会在用户选择文件后被触发。我们使用FileReader来读取文件内容，然后使用xlsx库的read函数来解析Excel文件，并通过sheet_to_json函数将第一个工作表转换为JSON格式。

请注意，这个例子假设Excel文件中的第一个工作表是需要解析的表。根据实际需求，你可能需要修改代码以支持其他功能，例如解析特定的工作表或者处理多个工作表。