{"size": 918, "ext": "js", "max_stars_repo_path": "src/screen/qr.js", "max_stars_repo_name": "a15zehcheche/raconet", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/screen/qr.js", "max_issues_repo_name": "a15zehcheche/raconet", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/screen/qr.js", "max_forks_repo_name": "a15zehcheche/raconet", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 22.3902439024, "max_line_length": 93, "alphanum_fraction": 0.5}
import React, { Component } from 'react';
import '../App.css';

class Qr extends Component {

    state = {
        link: this.props.link ? this.props.link :'null',
    }

  
    componentDidMount() {
        var QRCode = require('qrcode')
        var canvas = document.getElementById('canvas')
        
        QRCode.toCanvas(canvas, this.state.link, function (error) {
        if (error) console.error(error)
            console.log('success!');
        })
    }
   
    render() {
      
        const mystyle = { 
            backgroundColor: 'rgb(19, 19, 19)',      
        }
        const imgStyle = {
            'width':'100%',
        }
        return (
           <div style={mystyle} class="d-flex justify-content-center align-items-center p-5">
                <canvas id="canvas"></canvas>
                <script src="bundle.js"></script> 
           </div>
   
        )

    };
}

export default Qr;
