【vue】npm引进 QRCode 二维码生成器

最新推荐文章于 2024-08-08 08:03:06 发布

HHUFU..

最新推荐文章于 2024-08-08 08:03:06 发布

阅读量3.2k

点赞数 2

文章标签： vue.js npm javascript

本文链接：https://blog.csdn.net/weixin_43394840/article/details/122125927

版权

1.安装qrcodejs2
控制台输入：
npm install --save qrcodejs2
2.在vue文件引入
import QRCode from ‘qrcodejs2’
3.编写代码
前端

<div class="qrcode" ref="qrCodeUrl" :style="qrcodeSS != null? 'opacity:1':'opacity:0.5'"></div>

js代码

new QRCode(this.$refs.qrCodeUrl, {
            text: '网址/文字都可以', // 需要转换为二维码的内容
            width: 100, // 二维码宽度
            height: 100, // 二维码高度
            colorDark: '#000000',// 二维码颜色
            colorLight: '#ffffff', // 二维码背景
            correctLevel: QRCode.CorrectLevel.H //纠错等级容错级别，可设置为：QRCode.CorrectLevel.L、
            QRCode.CorrectLevel.M、QRCode.CorrectLevel.Q
            QRCode.CorrectLevel.H
          })