import QRCode from 'qrcode'
<div class="center column">
<div>
<img src="../../assets/icon/yiCity.png" style="height:364px;width:340px" alt />
<canvas id="canvas" style="width: 350px;height: 350px;"></canvas>
</div>
<div style="font-size:12px;margin-top:30px;">请顾客使用微信扫一扫关注(易城市APP)完成绑定</div>
</div>
// 在获取到数据的回调中去调生成二维码的方法 必须加上定时器,否则会报错
setTimeout( () => {
this.useqrcode(res.data.qrCode) // 此为绘画canvas的方法调用
}, 0)
useqrcode(qrCodeUrl){
//生成的二维码内容,可以添加变量
this.QueryDetail= qrCodeUrl
// this.QueryDetail = "http://192.168.1.103:8084" + "/shopMemberCard/" + this.shopMemberCardIds + '.html'; 携带参数的写法
console.log(this.QueryDetail)
var canvas = document.getElementById("canvas")
QRCode.toCanvas(canvas, this.QueryDetail, function (error) {
if (error) console.error(error)
console.log("success");
})
}
#canvas{
width: 50%!important;
height: auto!important;
position: absolute;
left: 127px;
top: 237px;
}
效果如下