关于使用axios上传文件和下载文件流的问题,很多都是通用的,代码块
上传文件
重点是采用multipart/form-data类型,利用formdata传数据
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
| const paramupdata = new FormData(); //创建form对象 paramupdata.append('file', '文件内容')
axios({ method: 'post', url: 'xxxx.api', data: paramupdata, headers:{'Content-Type':'multipart/form-data'} }) .then((res) => { console.log(res }) .catch((err) => { console.log(err) })
|
下载文件流
重点是接收数据类型,和返回的数据类型,然后利用a标签下载下来
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| // api.js
// excel导出 export const userExportForExcel = (postdata) => { // return new Promise((resolve, reject) =>{ request({ method: 'post', url:'xxxx', responseType:'blob', data: qs.stringify(postdata) }) .then((res) => { resolve(res) // that.allorgs = }).catch((err) => { reject(err) }) }) }
|
业务代码
1 2 3 4 5 6 7 8 9 10 11
| let res = await userExportForExcel(postdata) let blob = new Blob([res.data],{type: res.headers['content-type']}); let downloadElement = document.createElement('a'); let href = window.URL.createObjectURL(blob); //创建下载的链接 downloadElement.href = href; downloadElement.download = '项目类型.xlsx'; //下载后文件名 document.body.appendChild(downloadElement); downloadElement.click(); //点击下载 document.body.removeChild(downloadElement); //下载完成移除元素 window.URL.revokeObjectURL(href); //释放掉blob对象
|