<image id="saveImg" :src="imgSrc"></image>
主要是因为空格的处理:this.img.replace(/(\r\n)|(\n)|(\r)/g, "")
网络上的其他方式都尝试了 却忽略了最简单的问题;
computed: { imgSrc(){ if(/android/i.test(navigator.userAgent)){ //判断是不是安卓手机 var imgSrc = this.img.replace(/(\r\n)|(\n)|(\r)/g, "") return imgSrc; }else{ var url='data:image/png;base64'+this.img return url; } } },
以上就可以解决长按保存的问题
如果需要点击保存图片:以下方法会指引跳转到浏览器打开,微信中的H5无法下载;
<image id="saveImg" :src="img"></image>
// #ifndef APP-PLUS const base64 = this.img; // 这里是你的64位图片数据 var arr = base64.split(','); var bytes = atob(arr[1]); let ab = new ArrayBuffer(bytes.length); let ia = new Uint8Array(ab); for (let i = 0; i < bytes.length; i++) { ia[i] = bytes.charCodeAt(i); } var blob = new Blob([ab], { type: 'application/octet-stream' }); var url = URL.createObjectURL(blob); var a = document.createElement('a'); a.href = url; a.download = new Date().valueOf() + ".png"; var e = document.createEvent('MouseEvents'); e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); a.dispatchEvent(e); URL.revokeObjectURL(url); // #endif