flex=1和flex=0（默認)有什么區(qū)別？
react native是基于flex容器進行設(shè)計的耙册，當對component沒有顯式地設(shè)置flex的時候荧飞，flex=0，此時的component類似與android中的'content-wrap'滓玖，它的長和寬由自身的style來設(shè)置坪哄，或者在style沒有設(shè)置長寬的時候由子組件的長寬來設(shè)置(包裹子組件)。
當flex=1且沒有同級的組件势篡，那它就會占滿父組件或占滿屏幕翩肌。flex>0時，它就是對一個組件大小權(quán)重的設(shè)置禁悠。
如何利用flexDirection和flexWrap實現(xiàn)一個GridView
首先念祭，flexDirection代表子組件放置方向，可以設(shè)置'row'(按行放置)或者'column'(按列放置)碍侦；flexWrap代表子組件順著軸線放置粱坤，當超過父組件的軸線時，是否進行換行('wrap'/'nowrap')瓷产。
為了實現(xiàn)一個GridView站玄，可以使用React Native的ListView(FlatList)，因為只有當子組件超過父組件的軸線時才會換行濒旦，所以必須在renderRow中指定子組件的width株旷。在最新的RN中，width和height都可以用百分比來表示尔邓，這對于屏幕適配更好晾剖，但實現(xiàn)GridView的時候锉矢，應(yīng)該設(shè)置width再通過aspectRatio去設(shè)置height，這樣才會達到預(yù)期的效果齿尽。如果width和height都去設(shè)置沈撞，會因為ListView的每個cell的height都被styles.grid限制了，使用百分比就達不到預(yù)期效果雕什。（styles.grid在styles.item的外層）
_renderRow() {
return (
<View
style = {styles.item}
/>
);
}
<ListView
contentContainerStyle={styles.grid}
dataSource={this.state.dataSource}
renderRow={this._renderRow}
>
</ListView>
const styles = StyleSheet.create({
grid: {
flexWrap: 'wrap',
flexDirection: 'row'
},
item:{
width: 200
}
});
所以缠俺，在flex的使用不必在每個組件中去寫flex:1，也可以通過用百分比設(shè)置長寬贷岸，或者height/width+aspectRatio來寫彈性組件壹士。
alighItem, justifyContent 和 alignSelf
這三個屬性是設(shè)置組件排列順序的，react native在flex容器有一個主軸和一個副軸偿警，通過用這三個屬性來指定組件分別向兩個軸的哪個方向放置躏救。
justifyContent 是管主軸方向子組件的排列順序，在flex布局中螟蒸，默認的flexDirection是'column'盒使，所以主軸方向是'column'（y軸方向）∑呦樱可以設(shè)置的參數(shù)：'flex-start', 'flex-end', 'center', 'stretch'(默認)
alighItem 是管副軸方向子組件的排列順序(默認是x軸方向),可以設(shè)置的參數(shù)：'flex-start'(默認), 'flex-end', 'center', 'space-between', 'space-around'
alignSelf 是管副軸方向子組件的排列順序(默認是x軸方向)少办，但它會覆蓋父組件的alignItems，很強大很好用诵原∮⒓耍可以設(shè)置的參數(shù)：'auto'(默認)，'flex-start', 'flex-end', 'center', 'stretch'(默認)
絕對布局 position: 'absolute'
在某些情況下需要一個組件固定在父組件的某一個位置上绍赛，躲開flexDirection的控制蔓纠，這個時候，可以設(shè)置該組件的position: 'absolute'吗蚌，此時腿倚，這個組件一樣是占據(jù)了父組件的空間的。
那如果想要組件懸浮在父組件的某個指定位置蚯妇，我們只需要設(shè)置elevation的值就可以讓這個組件跑到父組件的上面敷燎，但要小心它會蓋住父組件下面的內(nèi)容。
