title: React Cannot read property 'bind' of undefined
body: <p>I am stuck with an issue that I don't understand with binding. I tried all ways of binding in all questions relative to this issue in StackOverflow but every time I have the same</p>
  <blockquote>
  <p><strong>Error: &quot;React Cannot read property 'bind' of undefined&quot;</strong></p>
  <p><strong>Error2:&quot;TypeError: Cannot read property '__reactInternalInstance$b7iw1elmz95' of null at <code>Object.getClosestInstanceFromNode&quot;</code></strong></p>
  </blockquote>
  <p>Because I've tried everything, I wonder if is that a real problem with the binding of an external problem.</p>
  <p>What I want to do is when I click on a button, another content appear.</p>
  <p>Here is my code :</p>
  <pre><code>import React, {Component} from 'react';
  
  export default class Projects extends Component {
    constructor(){
      super();
  
      this.state = {
        onShow: false,
        opacity: 0,
        height: 0
     }
   }
  
    OnShow(){
      this.setState({
        onShow: !this.state.onShow,
        opacity: this.state.opacity === 0 ? 1:0,
        height: '100vh'
      });
    }
  
    render(){
  
      return(
        &lt;div&gt;
          &lt;h2&gt;blabla&lt;/h2&gt;&lt;p&gt;some extra blabla&lt;/p&gt;
          &lt;button onClick={this.onShow.bind(this)}&gt;
            &lt;div opacity={this.state.opacity}&gt;YO&lt;/div&gt;
          &lt;/button&gt;
        &lt;/div&gt;
      );
    }
  }
  </code></pre>