title: Need to add a reference to a component's render method. addComponentAsRefTo(...)
body: <p>I believe I understand the following error, but I don't fully understand the solution.</p>
  
  <blockquote>
    <p>Uncaught Error: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's <code>render</code> method, or you have multiple copies of React loaded</p>
  </blockquote>
  
  <pre><code>import Modal from 'react-bootstrap-modal';
  //import MyCustomObject from './MyCustomObject';
  import ReactTelInput from 'react-telephone-input';
  
  ...
  render(){
      return (
          &lt;Modal show={this.props.showModal}&gt;
              &lt;Modal.Header&gt;
                  &lt;Modal.Title&gt;This is a heading &lt;/Modal.Title&gt;
              &lt;/Modal.Header&gt;
              &lt;Modal.Body&gt;
                      &lt;ReactTelInput
                          defaultCountry="us"
                          flagsImagePath='../../images/flags.png'
                          onChange={this.handleInputChange}
                          onBlur={this.handleInputBlur}
                      /&gt; // was previously &lt;MyCustomObject/&gt;
              &lt;/Modal.Body&gt;
              &lt;Modal.Footer&gt;
                  &lt;Button onClick={this.props.changeModal}&gt;Close&lt;/Button&gt;
              &lt;/Modal.Footer&gt;
          &lt;/Modal&gt;
      );
   }
  </code></pre>
  
  <p>My understandinng is that since a Modal doesn't recognize MyCustomObject, it has no idea how to render it. So, how can I get around this? Is there a way to directly add MyCustomObject to the Modal object? My next idea was to create my own modal class, extend react-bootstrap-modal, and simply have this extension import from MyCustomObject, but this also didn't work.</p>
  
  <p>So, how can I render my own objects inside of something like react-bootstrap-modal?</p>