Vue如何实现从response读取流下载
作者：自不惘
这篇文章主要介绍了Vue如何实现从response读取流下载问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
Vue从response读取流下载
1、创建公共方法
/**
* 从response读取流下载
* @param response 响应体
* @param suffix 文件后缀名
*/
function downloadBlob(response,suffix){
let fileName = new Date().getTime()+"_"+suffix+'.xlsx'
let blob = new Blob([response]);//response.data为后端传的流文件
let url = window.URL.createObjectURL(blob);
let downloadElement = document.createElement("a");
downloadElement.style.display = "none";
downloadElement.href = url;
downloadElement.download = fileName;
document.body.appendChild(downloadElement);
downloadElement.click();
document.body.removeChild(downloadElement);
window.URL.revokeObjectURL(url);
}
export default {
downloadBlob
}2、挂载到Vue原型上
import blob from '@/utils/blob' Vue.prototype.$blob = blob
3、使用
/** 导出按钮操作 */
handleExport() {
this.$confirm('是否导出所有数据?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return exportData();
}).then(response => {
this.$blob.downloadBlob(response,"数据表")
}).catch(()=>{})
}总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。