vue使用html2canvas进行页面截图
首页 > >    作者:lininn   2019年9月25日 11:21 星期三   热度:3446°   百度已收录  
时间:2019-9-25 11:21   热度:3446° 
Install
npm install html2canvas

Use
import html2canvas from 'html2canvas';

html
<!-- 截图区域 -->
<div id="faultTree" ref="faultTree"  :style="{width: '100%', height: height + 'px'}"></div>
<!-- 显示图片区域 -->
<img style="width: 100%;height: 300px;" class="real_pic" :src="dataURL" />

js
// methods
let self = this
let ref = this.$refs.faultTree // 截图区域
 this.$html2canvas(ref, {
      backgroundColor: '#142E48'
 }).then((canvas) => {
      let dataURL = canvas.toDataURL("image/png")
      self.dataURL = dataURL

二维码加载中...
本文作者:lininn      文章标题: vue使用html2canvas进行页面截图
本文地址:?post=397
版权声明:若无注明,本文皆为“覆手为雨”原创,转载请保留文章出处。
分享本文至:

返回顶部    首页    手机版本    后花园   会员注册   
版权所有:覆手为雨    站长: lininn