這一篇其實是應(yīng)該和之前的那篇react native 觸摸事件一起的判导，因為研究觸摸事件就是為了做這個功能畏铆。
觸摸事件文章地址：http://www.reibang.com/p/1ef0b869e532
Modal 組件可以用來覆蓋包含 react native 根視圖的原生視圖。
應(yīng)用場景： 自定義彈出框
react native 提供的 Alert 組件挂捅，局限性比較大涂佃，無法進(jìn)行自定義愿卒，幸好還有 Modal 可以來進(jìn)行自定義開發(fā)政钟。
效果圖如下：
（一） 常見屬性：
animationType： enum('none', 'slide', 'fade') 動畫類型
onRequestClose： Platform.OS === 'Android' ? PropTypes.func.isRequired : PropTypes.func
onShow： function 顯示完畢的回調(diào)方法
transparent： bool 是否為透明路克，默認(rèn)為不透明，彈框需要將這個設(shè)置成 true.
visible： bool 是否顯示
（二） 示例
<View>
<Modal
visible={this.state.modalVisible}
animationType={'none'}
transparent = {true}
onRequestClose={()=> this.onRequestClose()}
>
<TouchableOpacity style={{flex:1}} onPress={this._onClose}>
<View style={styles.modalBackground}>
<View style={ [styles.modalBox, { position:'absolute',top:this.state.y } ]}>
{
this.props.datas.child_class.map(function (cateKey) {
return (
<View style={styles.innerBox}>
<TouchableOpacity onPress={_linkTo}>
<Text style={styles.cateKeyWords}>{cateKey.gc_name}</Text>
</TouchableOpacity>
</View>
);
})
}
</View>
</View>
</TouchableOpacity>
</Modal>
</View>
1养交、布局：Modal 中可以再自定義布局精算，非常方便。而且 Modal 是覆蓋整個屏幕的碎连，可以形成半透明遮罩狀態(tài)灰羽，這就需要在最外一層上面設(shè)置其背景為半透明：
2、點擊空白處關(guān)閉：
Modal 的顯示與隱藏是通過 modalVisible 的狀態(tài)來決定的鱼辙，所以只要在最外面加上觸屏事件就可以了廉嚼。
3、定位：
因為我需要它根據(jù)我所點擊的位置去定位倒戏，所以需要取到點擊事件處于屏幕的位置：
現(xiàn)在位置信息已經(jīng)拿到并且將其放入 state 中怠噪，然后用的時候直接去取 state 的值就可以了。
