Vue Base64文件下载

问题：

• vue项目开发中，接口返回Base64文件（一张图片），前端需要下载该图片。

解决：

let base64 ='data:image/png;base64,'+this.initData.code"; // 文件base64
this.downloadFile('小程序码.png', base64);

// 下载Base64文件
downloadFileByBase64(data, fileName) {
    const blob = this.base64ToBlob(data);
    const url = URL.createObjectURL(blob);
    
    this.downloadFile(url, fileName)
},

// base64转blob
base64ToBlob(data) {
    let arr = data.split(',');
    let mime = arr[0].match(/:(.*?);/)[1];
    let bStr = window.atob(arr[1]);
    let n = bStr.length;
    let u8arr = new Uint8Array(n);
    
    while (n--) {
    u8arr[n] = bStr.charCodeAt(n);
    }
    return new Blob([u8arr], {type: mime});
},

// 下载
downloadFile(url, fileName) {
    const a = document.createElement("a");
    a.setAttribute("href", url)
    a.setAttribute("download", fileName)
    a.setAttribute("target", "_blank")
    let clickEvent = document.createEvent("MouseEvents");
    clickEvent.initEvent("click", true, true);
    a.dispatchEvent(clickEvent);
},