关于vue,uniapp,小程序生成普通二维码

348 阅读1分钟

关于vue,uniapp,小程序生成普通二维码

vue和uniapp

import QRCode from "qrcodejs2"(直接npm)
//html
<div ref="qrcodeDom" class="qrClass"></div>
//js
MakeQrcode(orderNo) {
		const host = "https://51ishare.oss-cn-hangzhou.aliyuncs.com"
		new QRCode(this.$refs.qrcodeDom, {
		text: host + '?' + 'orderNo' + '=' + orderNo, // 扫码后页面地址
		width: 128, // 二维码宽度
		height: 128, // 二维码高度
		colorDark: "#000000", // 二维码颜色
		colorLight: "#ffffff", // 背景颜色
		correctLevel: QRCode.CorrectLevel.H, // 校正水准
                               });
			}

微信小程序

import QRCode from "../../utils/weapp.qrcode.min"(直接去码云上拉去,使用dist文件下的js文件)
 MakeQrcode(orderNo) {
      const host = "https://51ishare.oss-cn-hangzhou.aliyuncs.com"
      const query = wx.createSelectorQuery()
      query.select('#qrcode')
        .fields({
          node: true,
          size: true
        })
        .exec((res) => {
          var canvas = res[0].node
          // 调用方法drawQrcode生成二维码
          QRCode({
            canvas: canvas,
            canvasId: 'qrcode',
            text:  host + '?' + 'orderNo' + '=' + orderNo,
          })
        })
    },