TouchableOpacity swallow touch event and never pass

问题

I'm trying to make both onPress to happened TouchableOpacity, but the second one is the only one that fires:

<TouchableOpacity onPress={() => console.warn('first button')}>
  <TouchableOpacity onPress={() => console.warn('second button')}>
    <Text>
      PRESS ME
    </Text>
  </TouchableOpacity>
</TouchableOpacity>

How can I make both of them fire?

Thanks in advance!

回答1:

You can fire both of them simply using the 'ref' concept and calling the props onPress.

<TouchableOpacity onPress={() => 
  AlertIOS.alert('firstbutton')
  } 
  ref={component => this.myFirstTouchable = component}
>
    <TouchableOpacity onPress={() => 
        {
        AlertIOS.alert('second')
        this.myFirstTouchable.props.onPress()
        }
    }>
        <Text>
          PRESS ME
        </Text>
      </TouchableOpacity>
    </TouchableOpacity>

来源：https://stackoverflow.com/questions/40572499/touchableopacity-swallow-touch-event-and-never-pass