今天就来给大家分享一下使用Vue生成二维码(可直接cv)
1.首先下载插件或者使用CDN链接来引入QRCode.js库
npm install qrcode
<script src="https://cdn.staticfile.org/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/qrcode.js/1.4.4/qrcode.min.js"></script>
2.在项目中全局引入或者局部引入,我这里选择的是组件内局部引入
import QRCode from 'qrcode';
3.HTML模板中准备二维码容器
这里的id很关键,这个元素的id需要和代码中的
document.getElementById('qrcode_down')匹配。
4.在methods创建生成二维码的方法
这里使用this.$nextTick是因为我需要在页面初始化的时候调用,所以写了等待DOM元素加载完成的方法
5.调用方法,创建二维码 上一步说我需要在页面初始化的时候调用方法,所以我在mounted中加载
这样我们就可以创建出对应的二维码了,感谢大佬们的观看!