title: Dynamically Create Ref in Constructor
body: <p>I want to make my child components have a ref, but I don't want the user to have to specify the ref when they create the component.  So say I have something like this:</p>
  
  <pre><code>&lt;Parent&gt;
      &lt;Child /&gt;
      &lt;Child /&gt;
  &lt;/Parent&gt;
  </code></pre>
  
  <p>And I want the parent to be able to access the Child components' state.  The easy way is to add a ref to each component, but I would like this to the be something that is done during the <code>constructor()</code> function to abstract this away from the end user, as I'd like these components to be generalized.</p>
  
  <p>Is there a clean way to make it so the parent can access the state of the child components, such as when the Child is created you have something like:</p>
  
  <pre><code>class Child extends Component {
      constructor(){
          super();
          this.state = {'abc': 123}
          this.ref=Math.random();
      }
  }
  </code></pre>
  
  <p>So that inside of the Parent class I can do something like:</p>
  
  <pre><code> class Parent extends Component {
       componentWillMount(){
           console.log(this.refs);
       }
   }
  </code></pre>
  
  <p>So I want to be able to declare a set of components like:</p>
  
  <pre><code>class App extends Component {
      render(){
         &lt;Parent&gt; &lt;Child /&gt; &lt;Child /&gt; &lt;/Parent&gt;
      }
  }
  </code></pre>
  
  <p>So that I can access each child and it's state as the parent iterates through child components.</p>