vue中下载文件,文档,兼容ie内核浏览器,项目实战,excel、pdf、doc都好用

可以直接copy代码使用。

第一步:

需要调用下载文件的接口,项目中的接口名_downloadTemplate,返回的res是文件流,然后使用文件流去下载文件

_downloadTemplate({signatoryId:item.signatoryId}).then(res=>{

    this.loading = false;

    this.createDownloadDom(res)

})

第二步:

createDownloadDom(data) { //创建下载的dom节点

    let blob = new Blob([data.data]);//新建blob对象

    let fileName = decodeURIComponent(data.headers.filename); //获取文件名

    if('download' in document.createElement('a')) { //IE下载

        let downloadElement = document.createElement('a');//创建a标签

        let href = window.URL.createObjectURL(blob); //创建下载的链接

        downloadElement.href = href;//创建下载链接

        downloadElement.download = fileName; //下载后文件名

        document.body.appendChild(downloadElement); //添加到dom中

        downloadElement.click(); //点击下载

        document.body.removeChild(downloadElement); //下载完成移除元素

        window.URL.revokeObjectURL(href); //释放掉blob对象

    }else { //非IE下载

        window.navigator.msSaveOrOpenBlob(blob,fileName)

    }

},

你可能感兴趣的:(vue中下载文件,文档,兼容ie内核浏览器,项目实战,excel、pdf、doc都好用)