vue下载base64图片文件流
时间: 2023-11-20 07:56:57 浏览: 47
以下是使用Vue下载base64图片文件流的方法:
```javascript
<template>
<div>
<button @click="downloadImg">下载图片</button>
</div>
</template>
<script>
export default {
methods: {
downloadImg() {
// 假设base64图片数据已经存在于imgData变量中
let imgData = 'data:image/png;base64,iVBORw0KG...';
let fileName = 'test.png'; // 下载的文件名
// 将base64转换为Blob流
let byteString = atob(imgData.split(',')[1]);
let ab = new ArrayBuffer(byteString.length);
let ia = new Uint8Array(ab);
for (let i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
let blob = new Blob([ab], { type: 'image/png' });
// 创建下载链接并模拟点击下载
let url = URL.createObjectURL(blob);
let link = document.createElement('a');
link.href = url;
link.download = fileName;
link.click();
URL.revokeObjectURL(url);
}
}
}
</script>
```