下载
npm i qrcodejs2 --save
导入
import QRCode from 'qrcodejs2'
使用
<div class="qrcode" ref="qrCodeDiv"></div> <script> import QRCode from 'qrcodejs2' export default { data() { return { }, methods: { bindQRCode() { this.$nextTick(() => { new QRCode(this.$refs.qrCodeDiv, { text: url,//url地址 文本等需要转换为二维码的内容 width: 80, height: 80, colorDark: "#333333", //二维码颜色 colorLight: "#ffffff", //二维码背景色 correctLevel: QRCode.CorrectLevel.L, //容错率,L/M/H }); }); }, }, mounted() { this.bindQRCode(); }, }; </script>
清除
//清除二维码 this.$refs.qrCodeDiv.innerHTML = "";
或者你还可以这么写
var qrcode = document.getElementById("qrcode"); var qrcode = new QRCode(qrcode , { text: "https://www.baidu.com/", width: 128, height: 128, colorDark : "#000000", colorLight : "#ffffff", correctLevel : QRCode.CorrectLevel.H });
qrcode.clear(); // 清除. qrcode.makeCode("二维码承载的信息"); // make another code.标签:插件,vue,qrCodeDiv,qrcodejs2,QRCode,二维码,qrcode From: https://www.cnblogs.com/fmj521/p/18216065