工具

【前端之日常工作】导出excal表格,接口为get、post的实

2019-11-28  本文已影响0人  北极星丶超帅的

一般导出excal表都是get方法,当参数过长时候后端就会给post方法

get导出excal表

exportHandler () {
      let params = qs.stringify(this.dataForm) //参数
      let apiURL =  "接口地址"
      let exportURL = "接口"
      let exportUrl = params ? `${apiURL}${exportURL}?${params}` : `${apiURL}${exportURL}`
        // window.open(exportUrl, "_blank");  //打开新的窗口
       window.location.href = exportUrl
}

post导出excal表

//二次封装的axios文件
export default {
  ...
  export: (url, data, config = {}) => {
    return axios({
      method: 'post',
      url,
      data: data,
      responseType: 'blob',
      headers: { 'Content-Type': ' application/json;charset=UTF-8' },
    }).then(res => {
      return Promise.resolve(res);
    }).catch(err => {
      return Promise.reject(err);
    })
  }
}
import http from '@/api/axios'
 ...
exportHandler (fileName) {
      let exportURL = "接口"
      http.export(`${exportURL}`, this.dataForm).then(res => { // 处理返回的文件流
          const link = document.createElement('a')
          let blob = new Blob([res.data], { type: 'application/vnd.ms-excel' })
          link.style.display = 'none'
          link.href = URL.createObjectURL(blob)

          let time = this.setDateNumber()
          let name = (fileName && typeof fileName === 'string') ? fileName : ''
          link.download = `${name}${time}.xlsx` //下载名字
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link)
        })
}
上一篇 下一篇

猜你喜欢

热点阅读