在VUE中使用QRCode.js

发布时间：2023-09-06 02:20责任编辑：顾先生关键词：js

什么是QRCode.js

QRCode.js是用于制作二维码的JavaScript库。QRCode.js支持在HTM中使用HTML5画布和表格标签进行交叉浏览。QRCode.js没有依赖关系

VUE里安装QRCode.js包

npm i qrcodejs2

VUE中引入qrcodejs2包

import QRCode from ‘qrcodejs2‘

创建DOM元素，存储二维码的位置

<div id="qrcode" ref="qrcode"></div>

生成二维码方法

qrCode (url) { ???let qrcode = new QRCode(‘qrcode‘, { ???????width: 150, //图像宽度
 ???????height: 150, //图像高度
 ???????colorDark : "#000000", //前景色
 ???????colorLight : "#ffffff", //背景色
 ???????typeNumber:4, 
 ???????correctLevel : QRCode.CorrectLevel.H //容错级别 容错级别有：（1）QRCode.CorrectLevel.L （2）QRCode.CorrectLevel.M （3）QRCode.CorrectLevel.Q （4）QRCode.CorrectLevel.H ???})
 ???qrcode.clear() //清除二维码 ????qrcode.makeCode(url) //生成另一个新的二维码}

ps:由于使用不起作用，在调用qrCode前使用js原生方法清空元素内容

document.getElementById(‘qrcode‘).innerHTML = ‘‘

在VUE中使用QRCode.js

原文地址：https://www.cnblogs.com/cuixiaozhen/p/9872307.html

在VUE中使用QRCode.js

知识推荐