前端vue 表格转换为图片导出

凹凸曼与程序猿

于 2022-05-17 10:08:18 发布

阅读量1.4k

点赞数 1

文章标签：前端 vue.js javascript

本文链接：https://blog.youkuaiyun.com/weixin_43994675/article/details/124815329

版权

 npm 安装npm install --save html2canvas
 
 <div v-if="detailflag" class="m-mt12" ref="imageWrapper1">
 表格
 </div>
  <a-icon
  type="copy"
 @click="createImg()"
  />
  
  import html2canvas from "html2canvas";
  createImg() {
      html2canvas(this.$refs.imageWrapper1).then((canvas) => {
        let dataURL = canvas.toDataURL("image/png");
        // console.log(dataURL);
        if (dataURL !== "") {
          var img = dataURL;
          var alink = document.createElement("a");
          alink.href = img;
          alink.download = "downloadName.png";
          alink.click();
        }
      });
    },
在这里插入代码片