title: How to use this.refs for a list of child components
body: <p>I have a list of <code>&lt;Child /&gt;</code> component, then I used an array <code>this.state.infos</code> to generate these child components. How can I use <code>this.refs</code> to get a specific child component? </p>
  
  <p>NOTE: <code>this.state.infos = ['tom', 'mike', 'julie'];</code> for example.</p>
  
  <pre><code>export default class Parent extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        infos: {},
      };
    }
  
    // ignore logic for this.state.infos
    // ...
  
    render() {
      return (
          &lt;div&gt;
            {[...this.state.infos].map((info) =&gt; {
              return &lt;Child
                ref={info}
              /&gt;
            })}
          &lt;/div&gt;
      );
    }
  }
  </code></pre>