title: React native TouchableOpacity onPress Problems
body: <p>I have a simple icon button as follows :</p>
  
  <pre><code>class SideIcon extends Component {
    render() {
      return (
        &lt;TouchableOpacity onPress={console.log('puff')} style={styles.burgerButton}&gt;
          &lt;Icon name="bars" style={styles.burgerIcon}/&gt;
        &lt;/TouchableOpacity&gt;
      );
    }
  }
  </code></pre>
  
  <p>It's called from the following component : </p>
  
  <pre><code>export default test = React.createClass({
    getInitialState: function() {
      return {
        isModalOpen: false
      }
    },
  
    _openModal() {
      this.setState({
        isModalOpen: true
      });
    },
  
    _closeModal() {
      this.setState({
        isModalOpen: false
      });
    },
    render() {
      return (
       &lt;View style={styles.containerHead} keyboardShouldPersistTaps={true}&gt;
       **&lt;SideIcon openModal={this._openModal} closeModal={this._closeModal} /&gt;**
        &lt;Text style={styles.logoName}&gt;DareMe&lt;/Text&gt;
        &lt;SideBar isVisible={this.state.isModalOpen} /&gt;
       &lt;/View&gt;
      );
    }
  });
  </code></pre>
  
  <p>But the <code>onPress</code>  on the <code>TouchableOpacity</code>  never  works. Where I'm going wrong ? Although It shows console statements during the component load.</p>