status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-02-10 08:26:23 +00:00
Code Issues Projects Releases Wiki Activity

ES6-ify Text Basics

Browse Source 
Summary: Closes https://github.com/facebook/react-native/pull/8363

Differential Revision: D3477431

Pulled By: caabernathy

fbshipit-source-id: 86ee5efb84e50609fbfae82102b1dc61fea69f05
This commit is contained in:
Joel Marcey 2016-06-23 12:30:36 -07:00 committed by Facebook Github Bot
parent 32ab5b6b41
commit be38b3b610
1 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
docs/Basics-Component-Text.md
View File

@ -12,40 +12,42 @@ The most basic component in React Native is the [`Text`](/react-native/docs/text
This example displays the `string` `"Hello World!"` on the device. This example displays the `string` `"Hello World!"` on the device.
```ReactNativeWebPlayer ```ReactNativeWebPlayer
import React from 'react'; import React, { Component } from 'react';
import { AppRegistry, Text } from 'react-native'; import { AppRegistry, Text } from 'react-native';
const AwesomeProject = () => { class TextBasics extends Component {
return ( render() {
<Text style={{marginTop: 22}}>Hello World!</Text> return (
); <Text style={{marginTop: 22}}>Hello World!</Text>
);
}
} }
// App registration and rendering // App registration and rendering
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject); AppRegistry.registerComponent('AwesomeProject', () => TextBasics);
``` ```
In this slightly more advanced example we will display the `string` `"Hello World"` retrieved from this.state on the device and stored in the `text` variable. The value of the `text` variable is rendered by using `{text}`. In this slightly more advanced example we will display the `string` `"Hello World"` retrieved from this.state on the device and stored in the `text` variable. The value of the `text` variable is rendered by using `{text}`.
```ReactNativeWebPlayer ```ReactNativeWebPlayer
import React from 'react'; import React, {Component} from 'react';
import { AppRegistry, Text } from 'react-native'; import { AppRegistry, Text } from 'react-native';
var AwesomeProject = React.createClass({ class TextBasicsWithState extends Component {
getInitialState: function() { constructor(props) {
return {text: "Hello World"}; super(props);
}, this.state = {text: "Hello World"};
render: function() { }
render() {
var text = this.state.text; var text = this.state.text;
return ( return (
<Text style={{marginTop: 22}}> <Text style={{marginTop: 22}}>
{text} {text}
</Text> </Text>
); )
} }
}); }
// App registration and rendering // App registration and rendering
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject); AppRegistry.registerComponent('AwesomeProject', () => TextBasicsWithState);
``` ```