mirror of
https://github.com/status-im/react-native.git
synced 2025-02-03 13:14:42 +00:00
072ef0a0d4
Summary: TLDR even more docs changes So I created a More Resources doc that aggregates the high-quality-but-off-site stuff. Let's try to put more outlinks there. Also I removed the stuff on Support that was not support, and some misc changes to clean stuff up. Closes https://github.com/facebook/react-native/pull/8329 Differential Revision: D3471669 Pulled By: JoelMarcey fbshipit-source-id: 54edd543ced1b3a8f3d0baca5475ac96bae6e487
1.3 KiB
1.3 KiB
| id | title | layout | category | permalink | next |
|---|---|---|---|---|---|
| basics-component-text | Text | docs | The Basics | docs/basics-component-text.html | basics-component-image |
The most basic component in React Native is the Text component. The Text component simply renders text.
This example displays the string "Hello World!" on the device.
import React from 'react';
import { AppRegistry, Text } from 'react-native';
const AwesomeProject = () => {
return (
<Text style={{marginTop: 22}}>Hello World!</Text>
);
}
// App registration and rendering
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);
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}.
import React from 'react';
import { AppRegistry, Text } from 'react-native';
var AwesomeProject = React.createClass({
getInitialState: function() {
return {text: "Hello World"};
},
render: function() {
var text = this.state.text;
return (
<Text style={{marginTop: 22}}>
{text}
</Text>
);
}
});
// App registration and rendering
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);