qrcodejs2 二维码生成h5自适应问题

编程入门 行业动态 更新时间:2024-10-09 03:28:03

qrcodejs2 二维码生成h5<a href=https://www.elefans.com/category/jswz/34/1769425.html style=自适应问题"/>

qrcodejs2 二维码生成h5自适应问题

h5开发中 ,因为插件postcss-pxtorem 会将px 转成rem

qrcodejs2生成的二维码没有自适应(不会根据屏幕改变大小),因为里面使用的是行内样式

自己改了插件代码,上传到npm

下载可直接使用

引入页面:
import QRCode from 'qrcodeliaowei'页面标签:
<div id="qrcode" ref="qrcode"></div>methods:creatQrCode() {this.$refs.qrcode.innerHTML = ''; //清除二维码方法一let text = 'xxxx';var qrcode = new QRCode(this.$refs.qrcode, {text: text, //页面地址 ,如果页面需要参数传递请注意哈希模式#colorDark: '#000000',colorLight: '#ffffff',correctLevel: QRCode.CorrectLevel.H,})qrcode.clear(); // 清除二维码方法二
}如果想使用vue vant组件中写h5
只需要在元素#qrcode样式中设置高宽即可
#qrcode{width:200px;height:200px;
}
二维码会根据元素#qrcode自适应

详情请看qrcodeliaowei - npm

更多推荐

qrcodejs2 二维码生成h5自适应问题

本文发布于:2024-03-13 00:57:02,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1732821.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:自适应   二维码

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!