• react 项目里 生成带logo的二维码


    1.安装模块

    npm install qrcode-react
    // 或者
    yarn add qrcode-react

    2.属性介绍

    size             二维码大小  number
    bgColor       二维码背景色string (CSS颜色)"#FFFFFF"
    fgColor        颜色 string (CSS颜色)
    logo             图片地址 string
    logoWidth    二维码宽度 number 
    logoHeight   二维码高度  number

    项目代码:(注意:value值最好不要带中文,否则会出现不能扫描的情况)
    3.页面调用

    /***
     * 扫码预览
     */
    import React, { PureComponent } from 'react';
    import QRCode from 'qrcode-react';
    import './index.less';
    
    class QrcodeModal extends PureComponent {
      constructor(props) {
        super(props);
        this.state = {}
      }
    
      render() {
        return (
          <div>
            <QRCode
              size={150}
              value={`https://www.baidu.com`}
              logo={`https://www.baidu.com/img/baidu_jgylogo3.gif`}
              logoWidth={50}
              logoHeight={50}
            />
          </div>
        );
      }
    }
    
    export default QrcodeModal;
    

    .

  • 相关阅读:
    MyBatis的缓存
    16年随笔
    linux 随笔
    Linux下启动Tomcat启动并显示控制台日志信息
    linux 连接工具
    Linux Tomcat重新启动
    SpringMVC 文件上传 MultipartFile
    spring @component
    mysql转型
    MyBatis传入参数
  • 原文地址:https://www.cnblogs.com/crazycode2/p/12550979.html
Copyright © 2020-2023  润新知