项目中实现文件下载功能-案例

Posted 2022-12-15 JackieDYH

// 接口实现
export function exportRockBoltExcel(data)
    return axiosexport(
        url:"/exportRockBoltExcel",
        method:"post",
        data,
        responseType:"blob"
    )


// API接口下载
API.exportRockBoltExcel(params).then((res)=>
    this.exportFile(res,'数据表');
    this.$message.success("ok")
).catch((err)=>
    this.$message.err("err")
)

 文件下载

// 文件下载
exportFile(blobs,name="默认文件名")
    let blob = new File([blobs],type:"application/octet-stream");
    if("download" in document.createElement("a"))
        const downloadElement = document.createElement("a");
        let href = "";
        if(window.URL)
            href = window.URL.createObjectURL(blob);
        else
            href = window.webkitURL.createObjectURL(blob);
        
        downloadElement.href = href;
        downloadElement.download = `$name.xlsx`;
        document.body.appendChild(downloadElement);
        downloadElement.click();
        if(window.URL)
            window.URL.revokeObjectURL(href);
        else
            window.webkitURL.revokeObjectURL(href);
        
        document.body.removeChild(downloadElement);
        URL.revokeObjectURL(href);
    else
        navigator.msSaveBlob(blob,name);