根据图片远程地址复制图片内容,可以在富文本、word等文本里粘贴
1.调用方法
<span@click="copyHandleImg('https://gxxxxyun.com/181bdef14fa.jpg')"v-if="!!company_info_sub.sub_company_name"class="copyText">复制
</span>
2.封装方法
//传输图片的url
copyHandleImg(url) {var canvas = document.createElement("canvas"); // 创建一个画板let image = new Image();image.setAttribute("crossOrigin", "Anonymous"); //可能会有跨越问题image.src = url;image.onload = () => {// img加载完成事件canvas.width = image.width; //设置画板宽度canvas.height = image.height; //设置画板高度canvas.getContext("2d").drawImage(image, 0, 0); //加载img到画板let url = canvas.toDataURL("image/png"); // 转换图片为dataURL,格式为pngthis.clipboardImg(url); // 调用复制方法};},// 从url下载并复制图片,如果是png格式的图片直接调用此方法就能复制成功async clipboardImg(url) {try {const data = await fetch(url);const blob = await data.blob();await navigator.clipboard.write([new window.ClipboardItem({[blob.type]: blob,}),]);alert("复制成功");} catch (err) {alert("复制失败");}},