vue读取excel表格
安装xlsx
npm install xlsx --save-dev
引入插件
import xlsx from 'xlsx'
上传读取
<input
type="file"
ref="upload"
accept=".xls,.xlsx"
@change="readExcel"
class="upload-button"
/>
<span class="tips">支持扩展名:.xls .xlsx,且不超过100M</span>
data() {
return {
excelData:'',
};
readExcel (e) {
console.log(e)
const files = e.target.files;
const fileReader = new FileReader();
fileReader.onload = (ev) => {
try {
const data = ev.target.result
const workbook = XLSX.read(data, {
type: 'binary'
}) // 读取数据
const wsname = workbook.SheetNames[0] // 取第一张表
const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]) // 生成json表格内容
// const ws1 = XLSX.utils.sheet_to_slk(workbook.Sheets[wsname]) // 输出表格对应位置是什么值
// const ws2 = XLSX.utils.sheet_to_html(workbook.Sheets[wsname]) // 生成HTML输出
// const ws3 = XLSX.utils.sheet_to_csv(workbook.Sheets[wsname]) // 生成分隔符分隔值输出
// const ws4 = XLSX.utils.sheet_to_formulae(workbook.Sheets[wsname]) // 生成公式列表(具有值回退)
// const ws5 = XLSX.utils.sheet_to_txt(workbook.Sheets[wsname]) // 生成UTF16格式的文本
console.log(ws)
this.excelData = [] // 清空接收数据
if(this.excelData.length) {
this.fileName = files[0].name;
}
} catch (e) {
return false
}
}
fileReader.readAsBinaryString(files[0]);
},