下载单图和文件

本文主要是介绍下载单图和文件，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

单图下载

原理是以下这种写法可以下载

<a href="/images/logo.png" download=""><img border="0" src="/images/logo.png" alt="runoob.com" >
</a>

不行的话依旧是走跟zip下载一样的流程

<span style="cursor: pointer; display: inline-block; margin-top: 10px" 
@click="downloadImg(current.whitePhoto)">下载</span>

	downloadImg(url) {let link = document.createElement('a')// 这里是将url转成blob地址，fetch(url).then((res) => res.blob()).then((blob) => {// 将链接地址字符内容转变成blob地址link.href = URL.createObjectURL(blob)// console.log(link.href)link.download = 'pic'document.body.appendChild(link)link.click()})},

zip下载

• 调用下载接口
• 创建a标签
• 创建下载链接
• 将a标签添加到body中
• 添加点击事件，进行下载
• 下载完成后移除a标签
• 释放掉blob对象

	downLoadFunc() {getDownload(uploadURL + '/collect/getStudentPhotosZip', this.form).then((res) => {const link = document.createElement('a')const blob = new Blob([res], {type: 'application/vnd.ms-wsworld',})link.style.display = 'none'link.href = URL.createObjectURL(blob)//创建下载链接link.setAttribute('download', '照片.zip')document.body.appendChild(link)//将a标签添加到body中link.click()//添加点击事件，进行下载URL.revokeObjectURL(link.href)//下载完成后移除a标签document.body.removeChild(link)//释放掉blob对象this.getTableData()})},

https://tool.oschina.net/commons/

这篇关于下载单图和文件的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---