title: How to Bubbling press event from inner Touchable to outer Touchable in React-Native?
body: <p>I've 2 nested <code>Touchable</code>s, I would like to capture the <code>onPress</code> event in either the outer <code>Touchable</code> and the inner <code>Touchable</code>, but only the inner one will fire the <code>onPress</code> event, so we can say that the event is not propagated to the parent element</p>
  
  <p>I'm using React-Native 0.57</p>
  
  <p>This is my snack <a href="https://snack.expo.io/@david92/bubbling-event" rel="noreferrer">example</a>.</p>
  
  <p>I also repost my render code here:</p>
  
  <pre><code>&lt;TouchableOpacity onPress={() =&gt; alert('outer')}
      style={{ backgroundColor: 'red', width: 200, height: 200 }}&gt;
      &lt;TouchableOpacity onPress={() =&gt; alert('inner')}
          style={{ backgroundColor: 'green', width: 100, height: 100 }}
      /&gt;
  &lt;/TouchableOpacity&gt;
  </code></pre>
  
  <p>How you can see only the inner alert or the outer alert are showed. <br>
  Instead I would like to show either the outer and the inner alert pressing on the green View...</p>
  
  <p>The code is a simplified version, in the real case the inner <code>Touchable</code> is a component that can be used in various scenario, either inside a <code>Touchable</code>, either in non Touchable component</p>