qrcodejs2插件的使用

最新推荐文章于 2024-11-20 15:02:37 发布

原创最新推荐文章于 2024-11-20 15:02:37 发布 · 957 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #vue.js

开发专栏收录该内容

4 篇文章

订阅专栏

1.npm安装: npm install qrcodejs2 --save

2.在要用的文件引入: import QRCode from 'qrcodejs2'

3.使用：

<div id="qrcode" ref="qrcode" class="qrcode" />
getCode() {
  new QRCode(this.$refs.qrcode, {
    width: 80, // 生成二维码得宽度
    height: 80, // 生成二维码得高度
    text: 'https://www.baidu.com', // 要生成二维码得链接或则文字
    render: 'canvas',
    colorDark: '#000', // 二维码前景色
    colorLight: '#fff', // 二维码背景色
    correctLevel: QRCode.CorrectLevel.L // 容错率  从低到高依次为LMQH,越高生成得二维码越密
  })
},
// 刷新二维码
refreshImg() {
  this.$refs.qrcode.innerHTML = '' // 刷新时清空原二维码
  this.getCode()
  this.$message.success('刷新成功！')
}