React Native 之TouchableOpacity组件
使用TouchableOpacity组件
实现单击事件只需要声明onPress属性即可,其他同理,实现onPressIn,onPressOut,onLongPress
constructor(props){ super(props); this.state = { title:'不透明触摸' } this.activiEvent = this.activiEvent.bind(this); } render() { return ( <View> {/* onPress={this.renderPress()} onPress={()=>this.activiEvent('点击')} onPressIn={()=>this.activiEvent('按下')} onPressOut={()=>this.activiEvent('抬起')} onLongPress={()=>this.activiEvent('长按')} */} <View> <TouchableOpacity activeOpacity={0.5} onPress={()=>this.activiEvent('点击')} onPressIn={()=>this.activiEvent('按下')} onPressOut={()=>this.activiEvent('抬起')} onLongPress={()=>this.activiEvent('长按')} > <View> <Text>我是文本但可以点击常用事件</Text> </View> </TouchableOpacity> </View> <View> <Text>{this.state.title}</Text>{/*标签内取值要用花括号*/} </View> </View> ); } renderPress(){ {/*还没点击就弹窗了 花括号注释不能写到函数外 标签内注释用花括号 标签外可以用// */} Alert.alert('iOS') } activiEvent(event){ this.setState({ title:event }) }
此文仅为鄙人学习笔记之用,朋友你来了,如有不明白或者建议又或者想给我指点一二,请私信我。liuw_flexi@163.com/QQ群:582039935.
我的gitHub: (学习代码都在gitHub)
https://github.com/nwgdegitHub/