mirror of
https://github.com/status-im/react-native-qrcode.git
synced 2025-02-02 22:03:56 +00:00
fix: update README.md
This commit is contained in:
parent
8a0729cc42
commit
f137cb11d7
63
README.md
63
README.md
@ -11,45 +11,46 @@ npm install react-native-qrcode
|
|||||||
```jsx
|
```jsx
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var React = require('react');
|
import React, { Component } from 'react'
|
||||||
var QRCode = require('react-native-qrcode');
|
import QRCode from 'react-native-qrcode';
|
||||||
var {
|
|
||||||
|
import {
|
||||||
AppRegistry,
|
AppRegistry,
|
||||||
StyleSheet,
|
StyleSheet,
|
||||||
View,
|
View,
|
||||||
TextInput
|
TextInput
|
||||||
} = require('react-native');
|
} from 'react-native';
|
||||||
|
|
||||||
var helloworld = React.createClass({
|
class HelloWorld extends Component {
|
||||||
getInitialState: function() {
|
state = {
|
||||||
return {
|
text: 'http://facebook.github.io/react-native',
|
||||||
text: 'http://facebook.github.io/react-native/',
|
};
|
||||||
};
|
|
||||||
},
|
|
||||||
render: function() {
|
|
||||||
return (
|
|
||||||
<View style={styles.container}>
|
|
||||||
<TextInput
|
|
||||||
style={styles.input}
|
|
||||||
onChangeText={(text) => this.setState({text: text})}
|
|
||||||
value={this.state.text}
|
|
||||||
/>
|
|
||||||
<QRCode
|
|
||||||
value={this.state.text}
|
|
||||||
size={200}
|
|
||||||
bgColor='purple'
|
|
||||||
fgColor='white'/>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
var styles = StyleSheet.create({
|
render() {
|
||||||
|
return (
|
||||||
|
<View style={styles.container}>
|
||||||
|
<TextInput
|
||||||
|
style={styles.input}
|
||||||
|
onChangeText={(text) => this.setState({text: text})}
|
||||||
|
value={this.state.text}
|
||||||
|
/>
|
||||||
|
<QRCode
|
||||||
|
value={this.state.text}
|
||||||
|
size={200}
|
||||||
|
bgColor='purple'
|
||||||
|
fgColor='white'/>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
container: {
|
container: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
backgroundColor: 'white',
|
backgroundColor: 'white',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center'
|
justifyContent: 'center',
|
||||||
|
marginTop: 80
|
||||||
},
|
},
|
||||||
|
|
||||||
input: {
|
input: {
|
||||||
@ -62,9 +63,9 @@ var styles = StyleSheet.create({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
AppRegistry.registerComponent('helloworld', () => helloworld);
|
AppRegistry.registerComponent('HelloWorld', () => HelloWorld);
|
||||||
|
|
||||||
module.exports = helloworld;
|
module.exports = HelloWorld;
|
||||||
```
|
```
|
||||||
## Available Props
|
## Available Props
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user