接口方式
export const downloadApi = (filePath,announceId) => {
return http.get('xxxxxxx后台接口地址',{filePath,announceId},{responseType: 'blob'})
}
下载的方法
html
<div class="append" v-if="contentDetail.announceAppendixList!=null">
<div class="append_title">
<div class="uploadName">附件:</div>
<div class="append_detail_box">
<div class="append_detail yto-font-primary-color" v-for="(append,index) in contentDetail.announceAppendixList.announceAppendixList" :key="index" @click="downLoad(append)">
{{append.appendixName}}
</div>
</div>
</div>
</div>
下载的方法
downLoad(append) {
downloadApi(append.appendixPath,this.announceId).then(res =>
this.downloadFile(res.data,append.appendixName)
})
},
downloadFile(content, fileName) {
(fileName && fileName.indexOf('.') !== -1) && (fileName = fileName.slice(0, fileName.indexOf('.')));
const blob = new Blob([content], {
type: content.type
})
const url = window.URL.createObjectURL(blob);
const a = document.createElement('a');
a.style.display = 'none';
a.href = url;
a.download = fileName;
document.body.appendChild(a);
a.click();
setTimeout(() => {
window.URL.revokeObjectURL(url);
document.body.removeChild(a);
}, 10);
},
网友评论