vue + element-ui + qrcodejs2 实现二维码生成


1、在所在项目下安装插件

1
npm i qrcodejs2

2、在需要生成二维码的页面引入qrcodejs

1
import QRCode from 'qrcodejs2'

3、使用

1
2
<el-button size="mini" type="primary" icon="el-icon-picture-outline" round @click="GenerateQRCode()">生成二维码</el-button></div>
<div id="qrcode" ref="qrcode"></div>

回调函数

1
2
3
4
5
6
7
8
9
10
11
// 生成二维码
GenerateQRCode () {
document.getElementById('qrcode').innerHTML = '' // 防止一直点击按钮重复生成二维码
const qrcode = new QRCode('qrcode', {
width: 200, // 二维码宽度,单位像素
height: 200, // 二维码高度,单位像素
text: this.softLink, // 生成二维码的链接
})
console.log('二维码信息:', qrcode)
},
}

文章作者: GoodTimeGGB
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 GoodTimeGGB !
评论
  目录