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 - npmhttps://www.npmjs.com/package/qrcodeliaowei