vue使用html2canvas生成图片并保存到本地
1、添加html2canvas插件
2、在script下引用插件
import html2canvas from ‘html2canvas‘;
3、使用方法调用
<!--二维码HTML--> <el-dialog title="二维码" :visible.sync="qrCodeDialogVisible" width="340px"> <div slot="footer" class="dialog-footer"> <div id="qrCode" ref="qrCodeDiv"></div> <el-button type="warning" @click="saveQrCode">保存二维码</el-button> </div> </el-dialog> <!--方法--> // 保存二维码为图片 saveQrCode () { html2canvas(this.$refs.qrCodeDiv).then(canvas => { const link = document.createElement(‘a‘) link.href = canvas.toDataURL() link.setAttribute(‘download‘, this.qrCodeTitle + ‘.png‘) link.style.display = ‘none‘ document.body.appendChild(link) link.click() }) }
相关推荐
songfens 2020-07-04
MIKUScallion 2020-06-11
northwindx 2020-01-04
jinxiutong 2019-12-27
大地飞鸿 2019-12-24
songfens 2019-12-06
飞翔的鱼 2019-11-17
大地飞鸿 2019-11-08
fanbih 2018-09-11
songfens 2019-10-21
yixiaof 2019-09-05
blair 2019-06-10
lanseguhui 2019-07-01
church 2019-07-01
lanseguhui 2019-07-01
Yaro 2019-07-01
yaosir 2019-07-01
yixiaof 2019-06-30