react 生成二维码、黏贴url到粘贴板

1. 安装qrcode.react、react-copy-to-clipboard

import QRCode from 'qrcode.react';
import { CopyToClipboard } from 'react-copy-to-clipboard';

2. 生成二维码

let renderQrCode = () => {
            const { qrcodeVisible, qrUrl } = this.state;
            return (
                <NCModal
                    show={qrcodeVisible}
                    onHide={this.onCloseQrModal}
                    size="md"
                    backdropClosable="true"
                    backdrop="true"
                    className="wps-preview-model"
                    minWidth="250"
                    minHeight="300">
                    <ModalHeader
                        closeButton={true}>
                        <span>二维码</span>
                    </ModalHeader>
                    <ModalBody style={{ clear:'both' }}>
                        <div style={{float:'left',width:'60%'}}>
                            <QRCode
                                id='qrCode'
                                value={qrUrl}
                                size={200}
                                style={{ margin: 'auto' }}/>
                        </div>
                        <div style={{float:'left',width:'40%'}}>
                            <span>二维码内容</span>
                        </div>
                    </ModalBody>
                    <ModalFooter>
                        <NCButton onClick={this.onCloseQrModal}>
                            关闭
                        </NCButton>
                        <a id='qrLink' className='u-button  nc-button-wrapper button-weishabushezhiyigemoren ' onClick={this.downQrCode}>下载</a>
                        <CopyToClipboard text={qrUrl}
                            onCopy={() => toast({ color: 'success', content: '复制成功' })}>
                                <a className='u-button  nc-button-wrapper button-weishabushezhiyigemoren ' onClick={this.downQrCode}>复制链接</a>
                        </CopyToClipboard>
                    </ModalFooter>
                </NCModal>
            );
        }