<el-button type="primary" @click="onExport">導(dǎo) 出</el-button>
methods: {
onExport() {
// 此處做想做的事情，然后調(diào)用download方法咕幻，并將服務(wù)端下載鏈接傳過去
this.download(src);
},
// 第一種方法通過隱藏的iframe標簽實現(xiàn)
download(src) {
this.$nextTick(() => {
if (typeof this.download_file.iframe == 'undefined') {
const iframe = document.createElement('iframe');
this.download_file.iframe = iframe;
document.body.appendChild(this.download_file.iframe);
}
const { iframe } = this.download_file;
iframe.src = src;
iframe.style.display = 'none';
// 若下載鏈接有效時間為5分鐘
const timer = setTimeout(() => {
document.body.removeChild(this.download_file['iframe']);
delete this.download_file['iframe'];
clearTimeout(timer);
}, 5 * 60 * 1000);
});
},
// 第二種方法通過隱藏的a標簽實現(xiàn)
download(src) {
this.$nextTick(() => {
if (typeof this.download_file.a == 'undefined') {
const a = document.createElement('a');
this.download_file.a = a;
document.body.appendChild(this.download_file.a);
}
const { a } = this.download_file;
a.href = src;
a.style.display = 'none';
a.click();
// 若下載鏈接有效時間為5分鐘
const timer = setTimeout(() => {
document.body.removeChild(this.download_file['a']);
delete this.download_file['a'];
clearTimeout(timer);
}, 5 * 60 * 1000);
});
},
},
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
