用canvas将图片和文字转化成照片,并复制到剪贴版
var delivery = document.getElementsByClassName("delivery");
var seconddelivery = document.getElementsByClassName("seconddelivery");
this.$nextTick(() => {
let opts = {};
html2canvas(delivery[0], opts).then((canvas) => {
if (seconddelivery[0].childNodes.length) {
seconddelivery[0].removeChild(seconddelivery[0].childNodes[0]);
}
seconddelivery[0].appendChild(canvas);
that.deliveryData.base64Data = canvas.toDataURL("image/png");
});
});
copyImgBtn() {
let base64Data = this.deliveryData.base64Data.split(",")[1];
const blobInput = this.convertBase64ToBlob(base64Data, "image/png");
const clipboardItemInput = new ClipboardItem({ "image/png": blobInput });
navigator.clipboard.write([clipboardItemInput]);
this.$message.success("复制照片成功!");
},
convertBase64ToBlob(base64, type) {
var bytes = window.atob(base64);
var ab = new ArrayBuffer(bytes.length);
var ua = new Uint8Array(ab);
for (var i = 0; i < bytes.length; i++) {
ua[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: type });
},
|