一、安装
npm install qrcodejs2 --save
或者
npm install qrcode2 --save
两个工具包都是可以的
二、引入
<script>
//PDF地址转成二维码
import QRCode from 'qrcodejs2'
export default {
components: {QRCode},
data() {
return {
}
}
</script>
三、页面代码调用
<a class="view-order" @click="qrcodeScan()">点击生成二维码</a>
<div class="bookcode" id="qrcode" ref="qrcode1"></div>
两种方法调用,一个是click事件,另一个如下
mounted() {
this.qrcodeScan(); // 注:需在mounted里触发qrcodeScan函数
}
四、js代码
qrcodeScan() {//生成二维码
let qrcode = new QRCode('qrcode', {
width: 150, //图像宽度
height: 150, //图像高度
colorDark : "#000000", //前景色
colorLight : "#ffffff", //背景色
typeNumber:4,
correctLevel : QRCode.CorrectLevel.H
})
qrcode.clear() //清除二维码
qrcode.makeCode("https://www.jianshu.com/p/9336746558fa") //生成另一个新的二维码
},
五、清空二维码(避免出现多个二维码)
document.getElementById("qrcode").innerHTML = "";