在vue中使用qrcode生成二维码

作用:QRCode.js 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库。

本文主要 描述   toCanvas 方法

使用 :

  • 安装

    yarn add qrcode
    
  • 导入

     import qrcode from 'qrcode'
  • 定义一个canvas标签放二维码

    • <canvas ref="canvas" />
  • 生成

    • qrcode.toCanvas(canvasElement, text, [options], [cb(error)])
    • canvasElement:画布标签
    • text: 需要编码的数据
    • cd(error):回调
    • options:配置项===>
      {
         text:要生成二维码的地址
         width;二维码的宽度
         height:二维码的高度
         colorDark:二维码的背景色
         colorLight:二维码的前景色
         以上配置只是一部分配置,
      }
      
      //例子:
        qrcode.toCanvas(this.$refs.canvas, imgsrc, { with: 400, height: 400 })

猜你喜欢

转载自blog.csdn.net/Mr_ZCheng/article/details/121523564

相关文章