Vue

uQRCode 二维码生成插件

2020-07-17  本文已影响0人  w晚风

在使用uni-app过程中需要生成二维码功能,主要是需在小程序里进行熏染。网上找了各种插件,最后去uni-app插件平台找到了这个

uQRCode 是一款使用方式简单,易于扩展的二维码生成插件。
特点是,
1:可以用画布渲染,也可以通过返回图片路径熏染,解决了小程序了原生组件层级过高问题
2:根据传入字符串的长短不会改变二维码的大小,边距留白也可自行设置,推荐使用

使用方式

在 script 中引用组件

import uQRCode from '@/common/uqrcode.js'

在 template 中创建 <canvas/>

<canvas canvas-id="qrcode" style="width: 215px;height: 215px;" />

在 script 中调用 make() 方法

export default {
  methods: {
    make() {
      uQRCode.make({
        canvasId: 'qrcode',
        componentInstance: this,
        text: 'uQRCode',
        size: 215,
        margin: 10,
        backgroundColor: '#ffffff',
        foregroundColor: '#000000',
        fileType: 'jpg',
        correctLevel: uQRCode.defaults.correctLevel,
        success: res => {
          console.log(res)
        }
      })
    }
  }
}

https://ext.dcloud.net.cn/plugin?id=1287
附上插件地址,如何使用,还有参数都写明了

上一篇下一篇

猜你喜欢

热点阅读