vue数据模板文件的下载三种方法

用vue2针对后台返回数据的不同提供的下载模板文件三种办法(针对Excel)

一、当后台返回的数据是文件流时,以下代码可实现直接下载文件到本地

let ele = document.createElement(“a”);
ele.style.display = “none”;
let file = “/user/exportExcelData”;//下载文件的后台接口
ele.href =file;
document.body.appendChild(ele);
ele.click();
document.body.removeChild(ele);

二、当调用接口后台返回的数据是二进制文件流(一个url链接)时,以下代码可实现对二进制文件进行处理并且进行下载文件到本地;

let res= await DownloadService.get2(name);//封装的后台接口API(name是返回的文件名)
let blob= new Blob([res.data], {//res.data是后台返回的二进制文件
type: “application/vnd.ms-excel;”//定义文件类型
// type: “application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8”
});
let url= URL.createObjectURL(blob);
let link= document.createElement(‘a’);
link.setAttribute(“href”, url);
link.setAttribute(“download”, name);
link.style.visibility = ‘hidden’;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);

三、当后台返回的数据直接是文件(在资源服务器上已经生成文件)时,以下代码亦可实现直接下载文件到本地

window.open(‘_blank’).location.href = “http://10.80.58.79:8003/user/exportException/”+ name//name是文件名,可在新窗口中打开并且下载文件。

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值