安装 xlsx

npm i xlsx --save

1.代码中发送请求接口

import { downFileStream } from "@/libs/tools";  //引入

export default {
    methods:{
        方法(){
            请求方法名().then(res => {
                downFileStream(res.data, "模板文件.xlsx");
            });
        }
    }
}

2.请求中

export const downFileStream = (blob, name) => {
  const url = URL.createObjectURL(blob)
  const link = document.createElement('a')
  link.style.display = 'none'
  link.href = url
  link.setAttribute('download', name)
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
  URL.revokeObjectURL(url)
}

导出文件

接口: 带上blob

//axios请求
export const 接口名= data =>
  axios.post('/abt/abtComKjLibw/exportTJbySNO', data, {
    responseType: 'blob'
  })

调用接口

exportTJbySNO('参数').then(res => {
   downFileStream(res.data, '使用统计表.xls')
})

axios封装时判断responseTypes类型

//响应拦截器
interceptors(instance,url){
    //请求
    instance.interceptors.request.use(
      config => {
        const {
          expireTime,
          refreshTime,
          ...infos
        } = getStorage('i_f', {})
        const token = getStorage('t_k')
        const now = Date.now()
        // 添加全局的loading...
        if (!Object.keys(this.queue).length) {
          // Spin.show() // 不建议开启，因为界面不友好
        }
        this.queue[url] = true
        config.headers.Authorization = token
        /**
         * 根据后台返回的 token 过期时间以及刷新时间来处理
         * 相关的逻辑,如果用户当前操作的时间是过期时间和
         * 刷新时间中间就自动执行刷新 token 接口,如果用户
         * 当前操作的时间已经超过了过期时间就转至登陆页面
         * 重新登陆。
         */
        if (refreshTime < now && expireTime > now && !this.isRefresh) {
          this.isRefresh = true
          this.request()
            .get('/saas/auth/refresh')
            .then(res => {
              infos.expireTime = res.data.data.expireTime
              infos.refreshTime = res.data.data.refreshTime
              setStorage('i_f', infos)
              setStorage('t_k', res.data.data.token)
              store.commit('setToken', res.data.data.token)
              store.commit('setInfo', infos)
              this.isRefresh = false
            })
        } else if (expireTime < now && typeof expireTime === 'number') {
          this.isRefresh = false
          logOut()
        }
        return this.transfromData(config)
      },
      error => {
        return Promise.reject(error)
      }
    )

    //响应
    instance.interceptors.response.use(
      res => {
        this.destroy(url)
        const {
          data,
          status,
          headers,
          config
        } = res
        // 判断导出文件的格式!!!
        const responseTypes = ['arraybuffer', 'blob', 'stream']
        if (data.code && data.code !== 200) {
          Message.error(data.msg)
          return {
            data,
          }
        } else if (responseTypes.includes(config.responseType)) {
          return {
            data,
            status,
            headers
          }
        } else {
          return {
            data,
            status
          }
        }
      },
      error => {
        this.destroy(url)
        let errorInfo = error.response
        if (!errorInfo) {
          const {
            request: {
              statusText,
              status
            },
            config
          } = JSON.parse(JSON.stringify(error))
          errorInfo = {
            statusText,
            status,
            request: {
              responseURL: config.url
            }
          }
        }

        if (errorInfo.status === 500 && errorInfo.data) {
          /**
           * @status {Number} 后台约定的状态码
           *
           * 119 token失效或未登录需要跳转至登陆页面
           */
          switch (errorInfo.data.status) {
            case 119:
              logOut()
              break
          }
        }
        return Promise.reject(error)
      }
    )

}