vue中后端做Excel导出功能返回数据流前端如何做处理
方法一:
exportData() { exportDevelopTaskProgressListInfo({ ...this.where, startTime: this.startDate, endTime: this.endDate }); },
api接口里:
export async function exportDevelopTaskProgressListInfo(params) { axios({ url: '/Statistics/exportDevelopTaskProgressListInfo', method: 'post', data: params, responseType: 'blob' }).then((res) => { if (res.data.size != 0) { const filename = '报表'; let blob = new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }); if (window.navigator && window.navigator.msSaveBlob) { window.navigator.msSaveBlob(blob, filename); } else { //其他浏览器 let link = document.createElement('a'); // 创建a标签 link.style.display = 'none'; let objectUrl = URL.createObjectURL(blob); link.href = objectUrl; link.setAttribute('download', filename); link.click(); URL.revokeObjectURL(objectUrl); } } else { res.data.message.error('暂无下载内容'); } }); }
方法二:
// 导出数据 exportData() { exportDevelopTaskProgressListInfo({ ...this.where, startTime: this.startDate, endTime: this.endDate, current: this.page, pageSize: this.limit }).then((res) => { console.log(res); if (res.data.size != 0) { const filename = '报表'; let blob = new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }); if (window.navigator && window.navigator.msSaveBlob) { window.navigator.msSaveBlob(blob, filename); } else { //其他浏览器 let link = document.createElement('a'); // 创建a标签 link.style.display = 'none'; let objectUrl = URL.createObjectURL(blob); link.href = objectUrl; link.setAttribute('download', filename); link.click(); URL.revokeObjectURL(objectUrl); } } else { res.data.message.error('暂无下载内容'); } }); },
api接口里:
export async function exportDevelopTaskProgressListInfo(params) { return await axios({ url:"/Statistics/exportDevelopTaskProgressListInfo", loading:true, method: "post", responseType: "blob", header: {'Content-Type': ' application/octet-stream'},// rest:true, data:params }) 或者 const res = await axios.post('/Statistics/exportDevelopTaskProgressListInfo',params,{responseType: "blob"}); if (res.status == 200) { return res } return Promise.reject(new Error(res.data.message)); }