1.问题基本信息
使用vue制作h5页面,需求是生成带二维码的海报进行分享。
通过qrcodejs2生成指定url路径的二维码
通过使用html2canvas生成指定div的截图信息
问题:生成的海报模糊
2.解决办法
不多废话直接贴关键代码
body部分:
<div class="poster_bg">
<div class="share_title">
<p style="margin: 0.5rem">长按图片保存并转发</p>
<!-- <p style="margin-bottom: 0.5rem"></p>-->
</div>
<div class="gift-card" id="content" :style="hintBg" ref="content" >
<img alt="logo" :src="getImgUrl(cardId)" @load="createPoster()" style="width: 90%;margin-top: 1rem">
<div class="gift-card-desc">
<div class="desc-left">
<span class="desc-title" >长按识别/扫描二维码</span>
<br>
<span class="desc-subtitle">即刻开启学霸之旅</span>
</div>
<div class="desc-right" id="qrcode">
</div>
</div>