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;
.