微信小程序生成二维码

https://www.jianshu.com/p/e6021798cd40

http://www.5imoban.net/jiaocheng/weixin/2020/0317/3778.html  推荐  下载weapp-qrcode.js

https://github.com/tomfriwel/weapp-qrcode

github地址

weapp-qrcode 点击查看(欢迎star)，其中附有源工程地址

使用

在github上下载工程，主要用到的文件是/utils/weapp-qrcode.js文件

引入文件：
可以将文件直接放在自己工程下面引入使用

import QRCode from '/utils/weapp-qrcode.js'

使用： https://dujian.blog.csdn.net/article/details/107729981  小程序上下滑动页面时canvas绘制的图出现抖动的情况 解决

<canvas class="canvas-code"canvas-id="myQrcode" style="background:#fff;width: 200px;height: 200px;"/>


<canvas class="canvas-code" canvas-id="myQrcode" 
disable-scroll="true" bindtouchstart="touchStart" 
bindtouchmove="touchMove" bindtouchend="touchEnd" style="background:#fff;margin:auto;margin-left: 70px;opacity:0;
position:absolute;top: 71px;left: 11px;"/>

<!--这里是生成的路径用图片显示-->
<image src="{{qrCode}}" style="background:#fff;width: 190px;height: 193px;margin:auto;"></image>

var qrcode = new QRCode('myQrcode',{
  text: 'http://www.tongxingschool.com',
  width: 200,
  height: 200,
  padding: 12, // 生成二维码四周自动留边宽度，不传入默认为0
  correctLevel: QRCode.CorrectLevel.L, // 二维码可辨识度
  callback: (res) => {
    console.log(res.path)
    // 接下来就可以直接调用微信小程序的api保存到本地或者将这张二维码直接画在海报上面去，看各自需求
    //也可以用 <image src="res.path"></image>
  }
})

colorDark: "#000000",
colorLight: "#ffffff",

//生成二维码
  productqrcode(val) {
    new QRCode('myQrcode', {
       //这样也行
    })
  },

// 用户二维码保存到本地相册
saveQrcode: function () {
    var that = this;
    wx.getImageInfo({
        src: that.data.qrcodePath,
        success: function (ret) {
            var path = ret.path;
            wx.saveImageToPhotosAlbum({
                filePath: path,
                success(result) {
                    if (result.errMsg === 'saveImageToPhotosAlbum:ok') {
                        wx.showToast({
                          title: '保存成功',
                        })
                    }
                }
            })
        }
    })
},

5、将rpx转px。由于二维码的canvas在页面中，显示，为了适应屏幕，采用了rpx作为单位。但是创建二维码new QRCode时，传入的是px，所以，为了传入的尺寸和canvas一样大，需要使用createRpx2px方法，将rpx转为px：

createRpx2px(rpx) {
    return wx.getSystemInfoSync().windowWidth / 750 * rpx
},

注意事项

• 二维码宽高，js代码和结构中的宽高需要一致，宽高的样式一定要写成内联样式，不然会有意想不到的效果😁
• padding的颜色自己控制即可，canvas的背景色就是留边的颜色
• correctLevel是生成二维码可辨识度的级别，级别越高可辨识度越高，从低到高依次是M、L、H、Q