vue使用QRCode插件,生成二维码
第一步
1 | cnpm install --save qrcode2 |
第二步
1 | import QRCode from 'qrcode2' |
第三步
1 | <div id= "qrcode" ref = "qrcode" /> |
第四步
lookqr(text) { this.dialogVisible = true /* 一定要在div生成之后再生成二维码,否则就会出现Cannot read property ‘appendChild’ of null"的错误 this.$nextTick DOM更新循环之后再执行 */ this.$nextTick(() => { this.getqr(text) // 链接转二维码图片 }) }, getqr(text) { /* 每次获取二维码之前清空二维码 */ this.$refs.qrcode.innerHTML = '' const qrcode = new QRCode('qrcode', { width: 200, // 设置宽度,单位像素 height: 200, // 设置高度,单位像素 text // 设置二维码内容或跳转地址 }) },
注意 :一定要在div生成之后再生成二维码 ,否则控制台会报错 Cannot read property ‘appendChild’ of null"
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了