在Vue中读取Excel表格内容，可以使用第三方库xlsx。以下是一个简单的例子：
- 首先，安装
xlsx库：
npm install xlsx- 然后，在Vue组件中使用
xlsx读取Excel文件：
<template>
<div>
<input type="file" @change="readExcel" />
<div v-if="excelData">
<table>
<tr v-for="(row, rowIndex) in excelData" :key="`row-${rowIndex}`">
<td v-for="(cell, cellIndex) in row" :key="`cell-${cellIndex}`">{{ cell }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
import * as XLSX from 'xlsx';
export default {
data() {
return {
excelData: null
};
},
methods: {
readExcel(event) {
const files = event.target.files;
if (files && files[0]) {
const fileReader = new FileReader();
fileReader.onload = e => {
const bufferArray = e.target.result;
const wb = XLSX.read(bufferArray, { type: 'buffer' });
const wsname = wb.SheetNames[0];
const ws = wb.Sheets[wsname];
this.excelData = XLSX.utils.sheet_to_json(ws, { header: 1 });
};
fileReader.readAsArrayBuffer(files[0]);
}
}
}
};
</script>在这个例子中，我们创建了一个Vue组件，其中包含一个文件输入元素。当用户选择一个Excel文件后，我们使用FileReader读取文件内容，然后使用xlsx库解析Excel文件并将第一个工作表转换为JSON。最后，我们将解析后的数据存储在组件的excelData数据属性中，并在模板中遍历展示。