// api封装
	export: data => request({ url: '/api/export', method: 'post', responseType: 'blob', data }),
	// 导出方法封装
	export function saveFile(data, name) {
	 // data 为二进制文件, name 文件名
	 try {
	   const blobUrl = window.URL.createObjectURL(data);
	   const a = document.createElement('a');
	   a.style.display = 'none';
	   a.download = name;
	   a.href = blobUrl;
	   a.click();
	 } catch (e) {
	   alert('保存文件出错');
	 }
	}
	// 实际使用
   exported() {
       this.$api.export(this.form).then(res => {
           if (res.status == 200) {
               const blob = new Blob([res.data]);
               saveFile(blob, '基础数据.xlsx');
           };
       });
   },

踩坑:responseType: 'blob’不生效的问题

先控制台打印返回实体中的响应类型responseType是否为blob或者其他文件类型,
这里data直接返回的是字符串,responseType值也为空,说明blob没有生效

请添加图片描述
这里可以看到 responseType值为空,虽然上面接口设置了 responseType: 'blob'也并没有生效. 那么没有生效的问题在哪里呢。

下面,我们看下我们axios接口封装的时候,是否有设置responseType

在这里插入图片描述之前就是别人已经封装好的框架,搞了半天这里请求没有写入responsetype,所以不生效。自己也有点无语了…
不过找到问题就行了,下面我们看看改了之后的返回格式
在这里插入图片描述

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐