2. 使用方式
wxml:
<view> <canvas class=\'canvas\' mode="widthFix" canvas-id=\'canvas\' bindlongtap="_saveQRcode"></canvas> <button bindtap="_makeQrcode">点击生成</button> </view>
wxss:
.canvas { margin: 10rpx auto ; margin-top: 20rpx; width: 200px; height: 200px; border: 10px solid var(--white); border-radius: 5%; background-color: var(--white); }
js: 主要代码
var qrcode; Page({ data: { ... }, /*点击按钮生成二维码*/ _makeQrcode:function(){ var text = "ssssssssssssss" qrcode.makeCode(text,function(){ console.log("回调") }); }, /*长按保存*/ _makeQrcode:function(){ qrcode.exportImage(function(path) { wx.saveImageToPhotosAlbum({ filePath: path, success(res) { wx.showToast({ title:\'保存成功\', icon:\'success\' }) }, fail(err) { console.log(err.errMsg) if (err.errMsg == "saveImageToPhotosAlbum:fail auth deny"){ wx.getSetting({ success: (res) => { /* 页面初始化 */ if(!res.authSetting["scope.writePhotosAlbum"]){ wx.showToast({ icon:\'none\', title:\'无法保存图片\r\n请开启“保存到相册”权限\', duration: 2000 }); } } }); } } }) }) }, onload:function(){ /* 初始化qrcode */ qrcode = new QRCode(\'canvas\', { usingIn: this, width: 200, height: 200, padding: 10, colorDark: "#1F1F1F", colorLight: "white", correctLevel: QRCode.CorrectLevel.H, }); } })
在以上基础上加点样式,效果如下
-------- 转载请标注
请发表评论