下载安装
npm install qrcodejs2-fix
直接上代码
<div ref="qrCodeBox"></div>
<button @click="getQrCode()">绘制二维码</button>
<script setup>
import QRCode from 'qrcodejs2-fix';//在需要使用的vue文件中导入即可
const ref=ref();
const qrCode=ref('')
const getQrCode = () => {
//清除上一次生成的二维码
ref.qrCodeUrl.innerHTML = ""
//清空该元素内内容
new QRCode(ref.qrCodeBox, {
//需要编码的文字内容或者URL
text: qrCode.value, // 需要转换为二维码的内容
width: 260, // 二维码的宽度
height: 260, // 二维码的高度
colorDark: "#000000", // 二维码的深色部分
colorLight: "#ffffff", // 二维码的浅色部分
correctLevel: QRCode.CorrectLevel.H, // 二维码的纠错水平
});
};
</script>