要安装 xlsx库,引入import XLSX from 'xlsx'
<input
ref="excel-upload-input"
class="excel-upload-input"
type="file"
accept=".xlsx, .xls, .csv"
@change="handleClick"
/>
handleUpload() {
this.$refs['excel-upload-input'].click();
},
handleClick(e) {
const files = e.target.files;
const rawFile = files[0]; // only use files[0]
if (!rawFile) return;
this.upload(rawFile);
},
upload(rawFile) {
this.$refs['excel-upload-input'].value = null; //
this.readerData(rawFile);
},
readerData(rawFile) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
//使用FileReader对象, FileReader通过异步的方式读取文件内容,结果均是通过事件回调获取
reader.onload = e => {
const data = e.target.result;
// 获取workbook对象,读取excel主要是通过XLSX.read(data, {type: type});方法来实现,返回一个叫WorkBook的对象 type为array是 Uint8Array,8位无符号数组
const workbook = XLSX.read(data, { type: 'array' })
const firstSheetName = workbook.SheetNames[0] // 是获取Sheets中第一个Sheet的名字
const worksheet = workbook.Sheets[firstSheetName] // 获取第一个Sheet的数据
const results = XLSX.utils.sheet_to_json(worksheet); // 输出JSON格式
const header = this.getHeaderRow(worksheet)
this.generateData({ header, results }) // 处理数据
resolve()
};
reader.onerror = e => {
console.log(e, '4')
reject(e)
}
// 以ArrayBuffer方式打开文件 读取本地文件
reader.readAsArrayBuffer(rawFile)
})
},
// 获取表头row
getHeaderRow(sheet) {
const headers = []
const range = XLSX.utils.decode_range(sheet['!ref']) //sheet['!ref']:表示所有单元格的范围,例如从A1到F8则记录为A1:F8
let C
const R = range.s.r
/* start in the first row */
for (C = range.s.c; C <= range.e.c; ++C) { /* walk every column in the range */
const cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })]
/* find the cell in the first row */
let hdr = 'UNKNOWN ' + C // <-- replace with your desired default
if (cell && cell.t) hdr = XLSX.utils.format_cell(cell)
headers.push(hdr)
}
return headers
},
generateData({ header, results }) {
let arr = []
results.map(item => {
arr.push({
[item['名称2']]: item['ying']
})
})
console.log(JSON.stringify(arr).replace(/\{|\}/g, ''))
},