具體需求：后端接口返回流數(shù)據(jù)，前端根據(jù)接口拿到的流數(shù)據(jù)轉(zhuǎn)換為excel表格
后端接口返回?cái)?shù)據(jù)示例：
image.png
注意：流數(shù)據(jù)可以被轉(zhuǎn)換為exel表格是項(xiàng)目的具體需求，是和后端約定好的
因?yàn)樾枰謩?dòng)改變axios的contentType和responseType，所以要單獨(dú)處理這次請(qǐng)求，將其封裝成一個(gè)hooks
import axios from 'axios'
import { ElMessage } from 'element-plus'
const exportAnalysisHooks = (url) => {
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
axios.defaults.responseType = 'blob'
axios
.post(
url,
{},
{
headers: {
Authorization: window.localStorage.getItem('analysis_platform_accessToken') || '',
},
}
)
.then((res) => {
const blob = new Blob([res.data], { type: 'application/vnd.ms-excel' })
const fileName = decodeURI(res.headers['content-disposition'])
if ('download' in document.createElement('a')) {
// 非IE下載
const elink = document.createElement('a')
elink.download = fileName
elink.style.display = 'none'
elink.href = URL.createObjectURL(blob)
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href) // 釋放URL 對(duì)象
document.body.removeChild(elink)
} else {
// IE10+下載
navigator.msSaveBlob(blob, fileName)
}
})
.catch((err) => {
console.log(err.response)
ElMessage.error(err.response.data.message || '請(qǐng)求失敗')
})
}
export default exportAnalysisHooks
調(diào)用的時(shí)候傳入url參數(shù)就可以了
import exportAnalysisHooks from '../../hooks/exportAnalysisHooks'
//調(diào)用
exportAnalysisHooks(url)
