话不多说,直接上代码
//导出按钮
exportClick() {
//导出接口
transcriptExport().then(res => {
console.log(res);
let blob = new Blob([res], {
type: "text/xml", //导出文件类型
})
let fileName = 'filename.docx'; //文件名称
// 允许用户在客户端上保存文件
if (window.navigator.msSaveOrOpenBlob) {
navigator.msSaveBlob(blob, fileName);
} else {
var link = document.createElement("a"); //定义一个a标签
link.href = window.URL.createObjectURL(blob); //需要生成一个 URL 来实现下载,链接到blob上
link.download = fileName; //下载后的文件名称
link.click();
console.log("fileName", link);
}
}).catch((err) => {
console.log(err);
});
}
注意:服务器响应的数据类型 —> responseType: 'blob'
//manage.js
import instance from '@/utils/request'
export function getExAction(url, parameter) {
return instance({
url: url,
method: 'get',
responseType: 'blob', //服务器响应的数据类型
params: parameter,
})
}
//api.js
import { getExAction } from '@/api/manage'
export function transcriptExport(memberId) {
return getExAction(`/admin/party/transcript/detail/export/${memberId}`)
}
//request.js
import axios from "axios";
const baseURL = process.env.VUE_APP_BASE_API || "/api";
axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";
// 创建axios实例
const service = axios.create({
// axios中请求配置有baseURL选项,表示请求URL公共部分
baseURL,
withCredentials: true,
// 超时
timeout: 10000,
});
// request拦截器
service.interceptors.request.use(
(config) => {}
(error) => {}
);
// 响应拦截器
service.interceptors.response.use(
(res)=>{}
(error)=>{}
);