title: How to trigger the open function for react-dropzone-component using refs?
body: <p>I am using the react drop-zone component to upload files to the server. </p>
  
  <p>I would like to call the drop-zone open function on button click.</p>
  
  <p>This is what I have tried so far:</p>
  
  <p>I am using <code>refs</code> to reference the drop zone. Also note I have multiple drop-zone's</p>
  
  <pre><code>&lt;DropzoneComponent
    style={{ height: 80 }}
    ref={this.myRef}
    config={config}
    eventHandlers={eventHandlers}
    djsConfig={djsConfig}
    /&gt;
  </code></pre>
  
  <p>And on a separate button click I am calling a function</p>
  
  <pre><code>  openDropZone1 = () =&gt; {
      this.refs.myRef.open();
      this.setState({
        bankStatement1: true,
        bankStatement2: false,
        bankStatement3: false
      });
    };
  </code></pre>
  
  <p>On click of the button I get the following error:-</p>
  
  <blockquote>
    <p>TypeError: Cannot read property 'open' of undefined
    on this line  <code>this.refs.myRef.open();</code></p>
  </blockquote>
  
  <p>Any help or suggestion is most appreciated.</p>
  
  <p>Thank you.</p>