Awesome

React Qrbtf

6 Different QRCode Styles - Change the parameters to show your favourite
Make Your Own - Use the API to make your own QRCode styles

Demo

QR codes

Installation & Usage

npm install react-qrbtf --save

Docs

Read docs here (not yet completed)

Include the Componet

import React from 'react'
import { QRNormal } from 'react-qrbtf'

class Component extends React.Component {

    render() {
        return <QRNormal value="https://qrbtf.com" />
    }
}

二维码中间图标参数

icon: 图标地址，支持 jpg/png/svg等，gif动态图没测试过
iconScale: 图标大小比例，不超过 0.33(默认)
title: 显示的文字
titleSize: 文字大小, 默认 12px
titleColor: 文字颜色, 默认黑色
titleAlign: 文字位置, 支持 middel|bottom

说明：

titleSize、titleColor、titleAlign 三个参数也支持从 styles.title 中取值，分别对应 fontSize、color、verticalAlign

如果在 styles.title 中设置 fontSize，请用数字（也即是不要带 px）

文字位置默认值：如果有 icon，在二维码底部，否则居中。文字多的情况下建议传参 bottom，不会自动换行