vue导入excel表格:vue将表格导出为excel - 龙恩0707
vue将表格导出为excel2018-03-18 19:51 龙恩0707 阅读(2649) 评论(1) 编辑 收藏 举报vue将表格导出为excelvue将表格导出为excel 一:在项
顺晟科技
2021-09-08 11:46:03
236
下面方法是前后端配合完成的导出功能,即前端需要调用后端接口。
如果后端返回的是base64格式的url,需要先转成二进制,再用blob处理;如果是文件流或二进制流,直接用blob处理即可。
//一般项目中会把公共的方法都放在util.js中,这里先放在.vue文件的methods中使用
/**
* @dataurl 后端返回的base64格式的url转成二进制
*/
dataURLtoBlob(dataurl){
// 1解码
var bstr = atob(dataurl),
// 2 创建长度为n的数组,初始化里面的相都为0,即[0,0,0,...]
n = bstr.length,
u8arr = new Uint8Array(n)
while (n--){
urarr[n]=bstr.charCodeAt(n)
}
return new Blob([u8arr],{type:\'application/vnd.ms-excel\'})
}
// 先把数据list传递给后端
exportDataList(){
let params = {
dataList:this.dataList
}
let that = this
api.exportMethod(params).then(res=>{
if(res.code==200){
let binaryFile = res.data.data,
blob = that.dataURLtoBlob(binaryFile),
url = window.URL.createObjectURL(blob), //返回一个对象URL
link = document.createElement(\'link\');
link.style.display = \'none\'
link.href = url
link.setAttibute(\'id\',\'downloadLink\')
link.setAttibute(\'download\',\'导出清单.xls\')
document.body.appendChild(\'link\')
link.click()
let objLink = document.getElementById(\'downloadLink\')
document.removeChild(objLink)
window.URL.revokeObjectURL(url)
}
})
},
let binaryFile = res.data.data,
blob = new Blob([binaryFile],type:\'\')
url = window.URL.createObjectURL(blob), //返回一个对象URL
link = document.createElement(\'link\');
link.style.display = \'none\'
link.href = url
link.setAttibute(\'id\',\'downloadLink\')
link.setAttibute(\'download\',this.downLoadFileName)
document.body.appendChild(\'link\')
link.click()
let objLink = document.getElementById(\'downloadLink\')
document.removeChild(objLink)
window.URL.revokeObjectURL(url)
23
2022-09
14
2022-09
14
2022-09
13
2022-09
08
2021-09
08
2021-09