Using 'ref' on React Styled Components is not working : <p>I am having difficulty using <code>ref</code>s with Styled Components. When I try to access them in my class methods like below, I get the following error:</p>

<blockquote>
  <p>Edit.js:42 Uncaught TypeError: this.....contains is not a function</p>
</blockquote>

<pre><code>  constructor(props) {
    ....
    this.setWrapperRef = this.setWrapperRef.bind(this);
    this.handleClickOutside = this.handleClickOutside.bind(this);
   }
----------
  setWrapperRef = (node) =&gt; {
    this.wrapperRef = node;
  }
  handleEdit = (e) =&gt; {
    e.preventDefault();
    this.props.onEdit(this.props.id, this.state.title);
  }
----------
&lt;Wrapper onSubmit={this.handleEdit} ref={this.setWrapperRef}&gt;
  ...
&lt;/Wrapper&gt;
</code></pre>

<p>I found the code from <a href="https://stackoverflow.com/questions/32553158/detect-click-outside-react-component">this question</a></p>

<p>What am I doing wrong here?</p>
