React-Native就提供了一套iOS原生的組件怔蚌，這樣就不用HTML5去模擬組件了是目。React-Native使用css來構建頁面布局谚攒，使用Native iOS Components給我們提供強大的組件功能
1.基礎代碼
import React, {Component} from 'react';
import {
NavigatorIOS,
ListView,
TextInput,
WebView,
TouchableOpacity,
AppRegistry,
StyleSheet,
Image,
Text,
View
} from 'react-native';
class AwesomeProject extends Component {
render() {
return (
<View>
</View>
);
}
}
var styles =StyleSheet.create({
});
AppRegistry.registerComponent('AwesomeProject', () => AwesomeProject);
2.嘗試改變view的樣式
render() {
return (
<View style={{borderWidth:5,height:60,borderColor:'blue'}}>
</View>
);
}
如下圖：
Paste_Image.png
3.關于組件的屬性
不要嘗試在style中寫入組件沒有的屬性
（1）第一種寫法令境，并不會有紅屏報錯提示挣菲，只會有warning
render() {
return (
<View style={{border:5,height:60,borderColor:'blue'}}>
</View>
);
}
Paste_Image.png
（2）第二種寫法晒旅，寫入樣式創(chuàng)建中栅盲，會有紅屏報錯,可以在Valid style props中看到組件支持的屬性
render() {
return (
<View style={styles.test}>
</View>
);
}
}
var styles = StyleSheet.create({
test: {
border: 5,
height: 60,
borderColor: 'blue'
}
}
);
Paste_Image.png
