method 1, use the a tag with the download result to jump to the address of the picture when clicked.
<img :src="miniProgramImg + "admin/miniProgram.jpg"" alt="">
<a download="" :href="miniProgramImg + "admin/miniProgram.jpg""></a>
method 2, download any file with the help of Base64
<img :src="miniProgramImg + "admin/miniProgram.jpg"" alt="">
<span @click="downloadImg"></span>
downloadImg () {
let href = this.miniProgramImg + "admin/miniProgram.jpg"
let canvas = document.createElement("canvas")
let alink = document.createElement("a")
alink.download = ""
alink.style.display = "none"
let context = canvas.getContext("2d")
context.drawImage(href, 0, 0)
alink.href = canvas.toDataURL("image/jpg")
document.body.appendChild(alink)
alink.click()
document.body.removeChild(alink)
}
this method reports an error: Uncaught TypeError: Failed to execute "drawImage" on" CanvasRenderingContext2D": The provided value is not of type"(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)"
the path of the picture in this is written dead, that is, the address of a network picture. Perhaps the first method is that there is a cross-domain problem that can not be downloaded, but I do not understand the reason for this, so I ask the boss to answer questions. How to download a network picture?