vue截图界面保存本地

npm install html2canvas -S

import html2canvas from 'html2canvas'

<template>
    <div>
        <div @click="saveImage()">截图保存图片</div>
        <div ref="ImageContent">
            界面内容...........
        </div>
    </div>
</template>    

saveImage() {
      const ImageDiv= this.$refs.ImageContent;
      //使用html2canvas把界面内容生成图片
      html2canvas(ImageDiv).then(res => {
        var dataUrl = res.toDataURL('image/jpeg', 1.0);//图片转为下载路径
        var a = document.createElement('a');//创建a标签
        a.href = dataUrl;
        a.download = '系统模块.png';//设置图片名称
        a.click();
      });
}