axios 通用下载方法(Post请求,Get请求参数位置有所变化,下载excel)
首先在我们request.js里引入axios并配置好拦截器等常规方法,通用下载方法以下。在request.js中配置好了怎么在组件里使用呢?首先在对应的组件中引入。
·
首先在我们request.js里引入axios并配置好拦截器等常规方法,通用下载方法以下
// 通用下载方法
export function download(url, params, filename) {
downloadLoadingInstance = Loading.service({ text: "正在下载数据,请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", })
return axios.post(url,params, {
//transformRequest: [(params) => { return tansParams(params) }],
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
responseType: 'blob'
}).then(async (res) => {
console.log(res);
const { data, headers } = res
console.log(headers)
const fileName = '文件名.xlsx' //headers['content-disposition'].replace(/\w+;filename=(.*)/, '$1')
console.log(fileName,'文件名');
// 此处当返回json文件时需要先对data进行JSON.stringify处理,其他类型文件不用做处理
//const blob = new Blob([JSON.stringify(res)])
const blob = new Blob([data], {type: headers['content-type']})
console.log(blob)
let dom = document.createElement('a')
let url = window.URL.createObjectURL(blob)
dom.href = url
dom.download = decodeURI(fileName)
dom.style.display = 'none'
document.body.appendChild(dom)
dom.click()
dom.parentNode.removeChild(dom)
window.URL.revokeObjectURL(url)
downloadLoadingInstance.close();
}).catch((r) => {
console.error(r)
Message.error('下载文件出现错误,请联系管理员!')
downloadLoadingInstance.close();
})
}
在request.js中配置好了怎么在组件里使用呢?
首先在对应的组件中引入
import {download} from '@/api/request'
然后调用下载方法
download(process.env.VUE_APP_BASE_API+'/ssxn/condition/exportExcel',{
//参数
name:this.queryParams.name,
type:this.queryParams.type,
phone:this.queryParams.phone
},'xxxx')
更多推荐
已为社区贡献3条内容
所有评论(0)