vue使用qrcode生成二维码，可以自定义大小

1，qrcanvas-vue插件，https://gera2ld.github.io/qrcanvas-vue/#logo。只支持像素大小的二维码



2，qrcode支持移动端自定义大小二维码


"qrcode": "^1.2.2",

import QRCode from 'qrcode';

<div class="qrcode_box">
  <canvas class="qrcode"></canvas>
</div>

_this.urlData为请求过来的url地址

渲染：

var canvas = document.querySelector('canvas')
QRCode.toCanvas(canvas, this.urlData)

css:

生成二维码之后在canvas标签里有style样式（单位为px），!important的层级比style要高，实现自定义大小

.qrcode_box{
  width: 4rem!important;
  height: 4rem!important;
  margin:rem(40) auto 0;
  .qrcode{
    width: 4rem!important;
    height: 4rem!important;
  }
}

转载于:https://www.cnblogs.com/lwj820876312/p/9621511.html