// 模板
<el-form-item label="批量录入:"> <div class="upload-button-box"> <input v-if="!fileName" type="file" ref="upload" accept=".xls,.xlsx" @change="readExcel" class="upload-button" /> <el-button v-if="!fileName" size="small" type="primary">上传文件</el-button> <span v-else>{{ fileName }}</span> <span class="tips">支持扩展名:.xls .xlsx,且不超过100M</span> </div> </el-form-item>
// 引入依赖
import XLSX from 'xlsx';
// 定义data
data () { return { fileObj: { '用户名': 'name', '密码': 'code', '号码': 'phone' } } },
// 方法
readExcel (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格式的文本 this.excelData = []; // 清空接收数据 for (let i = 0; i < ws.length; i++) { let sheetData = ws[i] // 对数据自行操作 this.excelData.push(sheetData) } // 针对特殊数据转换可在这里处理 this.excelData = this.excelData.map(item => { let obj = {}; for(let key in item){ let oKey = this.fileObj[key]; let txt = item[key]; obj[oKey] = txt; } return { ...obj } }) if(this.excelData.length) { this.fileName = files[0].name; } } catch (e) { console.log(e) return false } } fileReader.readAsBinaryString(files[0]); },