Vue 导出 excel 表格（调用后端接口转化为二进制流导出）

一、直接上代码（部分代码）

	<el-button
	  type="success"
	  icon="el-icon-download"
	  @click="batchExport"
	>批量导出</el-button>

	// 批量导出
    batchExport() {
      const params = {
        orderType: this.queryInfo.type,
        userName: this.queryInfo.user,
        orderNum: this.queryInfo.number
      }
      if (this.queryInfo.date) {
        params.startTime = this.queryInfo.date[0]
        params.endTime = this.queryInfo.date[1]
      } else {
        // 默认批量导出今天
        params.startTime = `${this.getCurrentDate()} 00:00:00`
        params.endTime = `${this.getCurrentDate()} 23:59:59`
      }
      getFlow(params).then(res => {
        this.downloadFile(res, '订单列表.xls')
      })
    },
    // 下载
    downloadFile(data, filename) {
      // 接收的是blob，若接收的是文件流，需要转化一下
      if (typeof window.chrome !== 'undefined') {
        // Chrome version
        const link = document.createElement('a')
        link.href = window.URL.createObjectURL(data)
        link.download = filename
        link.click()
      } else if (typeof window.navigator.msSaveBlob !== 'undefined') {
        // IE version
        const blob = new Blob([data], { type: 'application/force-download' })
        window.navigator.msSaveBlob(blob, filename)
      } else {
        // Firefox version
        const file = new File([data], filename, { type: 'application/force-download' })
        window.open(URL.createObjectURL(file))
      }
    },
    // 获取当前时间
    getCurrentDate() {
      const dt = new Date()
      const year = dt.getFullYear()
      const month = String(dt.getMonth() + 1).padStart(2, '0')
      const date = String(dt.getDate()).padStart(2, '0')
      return `${year}-${month}-${date}`
    }


	// api.js 文件（注意：我这里将请求封装了，具体代码就不一一展示了）
    // 获取二进制流（批量导出时用）
	const getFlow = params => {
  	  return axios.get2(baseUrl + '/TrainingCenter/order/export', { params })
	}
	// get 方法2，获取二进制流
  	get2(url, data) {
      const options = Object.assign(
        {
          method: 'get',
          url,
          responseType: 'blob' // 将接口返回数据类型设置为 blob 类型
        },
        data
      )
      return this.request(options)
  	}