事件

/**
 * 事件
 */

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
    },

});

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容