Props
大多数组件在创建时都需要用各种不同的参数来自定义，这些参数就称作props。
例如，创建一个image时，可以使用source属性进行控制图片显示。
import React, { Component } from 'react';
import { AppRegistry, Image } from 'react-native';
class Bananas extends Component {
render() {
let pic = {
uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'
};
return (
<Image source={pic} style={{width: 193, height: 110}}/>
);
}
}
AppRegistry.registerComponent('Bananas', () => Bananas);
注意到：{pic}通过大括号包围，这样就把pic变量迁入到JSX语句中。通过这样方法可以把任何正确合法的JavaScript的表达式迁入到JSX中。
自定义的组件也可以使用props。可以在不同场景下，通过不同属性定制组件，最后在你的render（）方法直接通过this.props进行引用即可。
import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';
class Greeting extends Component {
render() {
return (
<Text>Hello {this.props.name}!</Text>
);
}
}
class LotsOfGreetings extends Component {
render() {
return (
<View style={{alignItems: 'center'}}>
<Greeting name='Rexxar' />
<Greeting name='Jaina' />
<Greeting name='Valeera' />
</View>
);
}
这样就可以根据属性值不同从而复用该组件了。当然，上面也看到了一些View组件，这个View组件是其他组件的容器，可以用来帮助控制风格、样式和布局。我们可以使用props和一些基础的View,Image,Text组件，就足以编写出各式各样的UI界面了。
state
改变组件一般有两种类型的数据：props和state。
props是在父组件中进行设置，只要设置完成，该组件在声明周期中就定死。
针对数据变化修改的情况，需要使用state。
一般情况下，需要在constructor方法中进行初始化state，然后在想要修改更新的时候，调用setState方法即可。实际中，当服务器有新数据的响应，或有用户输入时，也可以使用一些例如Redux的状态容器来进行统一管理数据，而不是直接调用setState。
Style
在React Native中，定制样式只需通过JavaScript定义应用的样式。所有核心的组件都有style的属性。
在实际开发中，组件的样式可能比较复杂，推荐的常用方法是使用StyleSheet.create来在一个地方定义多种样式。
import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, View } from 'react-native';
class LotsOfStyles extends Component {
render() {
return (
<View>
<Text style={styles.red}>just red</Text>
<Text style={styles.bigblue}>just bigblue</Text>
<Text style={[styles.bigblue, styles.red]}>bigblue, then red</Text>
<Text style={[styles.red, styles.bigblue]}>red, then bigblue</Text>
</View>
);
}
}
const styles = StyleSheet.create({
bigblue: {
color: 'blue',
fontWeight: 'bold',
fontSize: 30,
},
red: {
color: 'red',
},
});
AppRegistry.registerComponent('LotsOfStyles', () => LotsOfStyles);
