代码：

<template><div class="hello"><img src="../assets/logo.png" ref="image"><button @click="screenshot">开始截图</button><hr><div class="img" id="img"></div></div>
</template><script>
import kscreenshot from 'kscreenshot';  // https://gitee.com/kejiacheng/kscreenshot/
import {Message} from 'element-ui';
export default {name: 'HelloWorld',data(){return{screenshotBase64:'', // 截图获得的base64kscreenshot:{}, // 实例}},mounted() {this.createKscreenshot()},methods:{// 初始化创建实例createKscreenshot(){this.kscreenshot = new kscreenshot({key: 65, // 截图触发按键（例：65时则同时按下shit + A则触发截图）needDownload: false, // 是否下载截图后的图片immediately: false, // 是否立即开启截图toolShow:{complete:true,	// 控制确认按键显示quit:true,	// 控制退出按键显示back:true, // 控制后退按键显示arrow:true,	// 控制箭头按键显示drawLine:true,  // 控制线条按键显示rect:true,  //	控制矩形按键显示ellipse:true,  //	控制椭圆按键显示text:true,  //	控制文字按键显示color:true,  //	控制颜色版按键显示}, // 工具栏各个工具显示endCB(e) { //截图成功回调 e是base64编码this.screenshotBase64 = e;// 创建图片元素并追加至id为img的元素内部let img = new Image();img.src = this.screenshotBase64;document.getElementById('img').appendChild(img);},cancelCB(e) { //截图失败回调Message.error('截图失败！');}})},// 开始截图操作screenshot(){// endScreenShot()	结束截图// startScreenShot()  开启截图this.kscreenshot.startScreenShot()}}
}
</script><style scoped lang="scss">
.hello{.img{border: 2px solid #8def82;padding: 10px;}
}
</style>

运行示例：