React 前端生成二维码

安装组件： npm install qrcode.react --save

引入组件： import QRCode from 'qrcode.react';

生成二维码

<QRCode
    value='https://www.baidu.com/'// 生成二维码的内容
    size={300} // 二维码的大小
    fgColor="#000000" // 二维码的颜色
    imageSettings={{ // 中间有图片logo
      src: logo,
      height: 60,
      width: 60,
      excavate: true
    }}
  />
</div>

注意： 发现在浏览器中，imageSetting 图片和整体二维码的比例不能超过4:1，图片是在二维码的上方覆盖了一层，底层的二维码并没有改变，如果覆盖的比例过大，导致二维码扫描识别不了正确的。