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