import FileSaver from 'file-saver'
import XLSX from 'xlsx'
导入
<el-upload
class="upload-demo"
drag
action="https://jsonplaceholder.typicode.com/posts/"
multiple
accept=".xlsx"
:on-exceed="exceed"
:limit="1"
:on-remove="remove"
:http-request="uploadFile"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处,或
<em>点击上传</em>
</div>
<div class="el-upload__tip" slot="tip">1次只能上传1个xls文件,且不超过500kb</div>
</el-upload>
// 如果读取时间 XLSX.read(data, { type: 'binary', cellDates: true })
async uploadFile (params) {
const _file = params.file
const fileReader = new FileReader()
fileReader.onload = ev => {
try {
const data = ev.target.result
const workbook = XLSX.read(data, {
type: 'binary'
})
for (const sheet in workbook.Sheets) {
// 循环读取每个文件
const sheetArray = XLSX.utils.sheet_to_json(workbook.Sheets[sheet])
// 若当前sheet没有数据,则continue
if (sheetArray.length == 0) {
continue
}
console.log('读取文件')
console.log(sheetArray) //读取出来的内容
this.dataList = sheetArray
}
} catch (e) {
this.$message.warning('文件类型不正确!')
}
}
fileReader.readAsBinaryString(_file)
},
导出
第一种:根据ele的table表格导出
var xlsxParam = { raw: true } // 转换成excel时,使用原始的格式
var wb = XLSX.utils.table_to_book(
document.querySelector('#outTable'),
xlsxParam
) // outTable为列表ID
var wbout = XLSX.write(wb, {
bookType: 'xlsx',
bookSST: true,
type: 'array'
})
try {
FileSaver.saveAs( //这里的sheetjs.xlsx是名字
new Blob([wbout], { type: 'application/octet-stream;charset=utf-8' }),
'sheetjs.xlsx'
)
} catch (e) {
if (typeof console !== 'undefined') console.log(e, wbout)
}
return wbout
第二种:根据数组转换为表格
var _data = [
['id', 'name', 'value'], // 第一行
[1, 'sheetjs', 7262], // 第二行
[2, 'js-xlsx', 6969] // 第三行
]
const ws = XLSX.utils.aoa_to_sheet(_data)
const wb = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(wb, ws, 'Sheet1')
XLSX.writeFile(wb, 'SheetJS.xlsx')
数据是个二维数组,相当于第一行,第二行,第三行,以此类推。