/**
* 事件
*/
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View,
Image,
TextInput,
TouchableOpacity,
} from 'react-native';
var Dimensions =require('Dimensions');
var {width, height}=Dimensions.get('window');
export default class TouchComment extends Component<{}> {
constructor(props) {
super(props)
this.state={
//给初始的state
title:'初始值'
}
}
onEventMethod(event){
this.setState({
title:event
})
}
render() {
return (
<View style={styles.container}>
{/*TouchableOpacity 是点击后的一个透明度的设置
可以在里面设置各种的方法属性。
onPress
onPressIn
onPressOut
onLongPress
*/}
<TouchableOpacity activeOpacity={0.4}
onPress={()=>this.onEventMethod('点击')}
onPressIn={()=>this.onEventMethod('按下了')}
onPressOut={()=>this.onEventMethod('抬起')}
onLongPress={()=>this.onEventMethod('长按了')}
>
<Text style={{backgroundColor: 'red', padding: 20}}>点击事件</Text>
</TouchableOpacity>
<Text>
{this.state.title}
</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#dddddd',
alignItems:'center',
justifyContent:'center',
paddingTop:10
},
});
事件
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 这个问题的整理是基于面试题:给同一个DOM元素绑定两个事件,一个用冒泡,一个用捕获,会执行几次?先执行冒泡还是先执...
- 事件分类 鼠标事件 click/ mousedown/ mousemove/ mouseup/ contextme...
- 一.事件 事件是用户或浏览器自身执行的某种动作,这是我自己的理解。 二.事件流 事件流描述的是从页面中接收事件的顺...