【前端之日常工作】导出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)
})
}