vue-文件导出

话不多说，直接上代码

  //导出按钮
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)=>{}
);