From f67906cd7a03bd1171a6d9b3b0c0a84116d35190 Mon Sep 17 00:00:00 2001 From: Yuval Adam Date: Mon, 15 Aug 2016 16:10:24 +0300 Subject: Add basic qrious integration --- index.js | 41 ++++++++++++++++++++++++++++------------- package.json | 4 +++- 2 files changed, 31 insertions(+), 14 deletions(-) diff --git a/index.js b/index.js index df632d8..e18098f 100644 --- a/index.js +++ b/index.js @@ -1,24 +1,39 @@ import React from 'react' import ReactDOM from 'react-dom' +import QRious from 'qrious' class Qrgen extends React.Component { - constructor (props) { - super(props) - this.state = { - 'text': 'abcde' - } + constructor (props) { + super(props) + this.state = { + 'text': 'abcde' } + } - render () { - return
-

qrgen

- { - this.setState({ text: e.target.value }) - }}> -

{this.state.text}

-
+ updateQr () { + const qr = new QRious({ + element: document.getElementById('qr'), + value: this.state.text + }) + } + + componentDidUpdate (prevProps, prevState) { + if (this.state.text != prevState.text) { + this.updateQr() } + } + + render () { + return
+

qrgen

+ + { + this.setState({ text: e.target.value }) + }}> +

{this.state.text}

+
+ } } ReactDOM.render(, document.getElementById('root')) diff --git a/package.json b/package.json index a3a1792..d71cf5a 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,9 @@ "version": "1.0.0", "description": "qrgen.xyz", "main": "index.js", - "dependencies": {}, + "dependencies": { + "qrious": "^2.0.2" + }, "devDependencies": { "babel-core": "^6.10.4", "babel-loader": "^6.2.4", -- cgit v1.3.1