vue导出excel表格

使用Vue.js的$http方法进行POST请求,通过设定responseType为blob来处理二进制流数据,生成新的Blob对象。然后创建隐藏的a标签,设置href为创建的ObjectURL,点击a标签触发文件下载,最后移除a标签并释放ObjectURL。对于已存在于public目录下的Excel文件,可以直接创建a标签进行下载。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

调用导出
 this.$http({
   method: "POST",
   url: 'user/fileGeneration',
   responseType: "blob", //定义为blob
   data: {},
 }).then((res) => {
   this.dialogVisible = false
   const file = new Blob([res.data]);
   const a = document.createElement("a");
   const fileName = '调研记录列表.xlsx';//下载文件名称
   a.download = fileName
   a.style.display = 'none'
   a.href = URL.createObjectURL(file);
   document.body.appendChild(a);
   a.click();
   URL.revokeObjectURL(a.href);
   document.body.removeChild(a);
 })

截取数据流中的文件名

   let temp = res.headers["content-disposition"].split(";")[1].split("filename=")[1]
   let fileName = decodeURIComponent(temp)
   a.download = fileName

下载本地的excel表格

先把excel放在public下面

this.dialogVisible = false
const a = document.createElement('a');
a.href = '/reponse.xls';
a.download = 'reponse.xls';
console.log(a.href)
a.style.display = 'none';
document.body.appendChild(a);
a.click();
a.remove();
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值