<template>
<div class="hello">
<h2>二维码</h2>
<canvas ref="qrCodeCanvas"></canvas>
<div>{{url}}</div>
</div>
</template>
<script>
import QRCode from 'qrcode';
export default {
props: {
msg: String,
url:''
},
methods: {
generateQRCode () {
const canvas = this.$refs.qrCodeCanvas; // 获取 canvas 元素的引用
const text = 'https://www.baidu.com'; // 二维码的文本内容
QRCode.toCanvas(canvas, text, (error) => {
if (error) {
console.error('生成二维码失败', error);
}
});
},
text () {
var url=window.location.href;
this.url=url;
console.log(url)
},
},
mounted () {
this.text();
this.generateQRCode();
},
}
</script>
<style scoped>
</style>
效果: