title: How to create dynamic refs in functional component- Using useRef Hook
body: <p>I want to have refs in functional component which have elements dynamically rendered. </p>
  
  <p>please help me in creating Dynamic Refs using useRef Hook and accessing in the handler.</p>
  
  <p>1) Need to create 3 useRefs to point 3 buttons.</p>
  
  <p>2) Access them in button handler using "ref1.value" Or "ref2.value" etc</p>
  
  <pre><code>    let abc=[1,2,3];
   function submitclick(){
    alert(123);
  // Here i want to access the buttons with using the refs
    }
    return ( &lt;div&gt;
    {  abc.map(function(index){ return (&lt;button ref='123' onClick={submitclick}&gt;{`Button${index}`}&lt;/button&gt;)})}
      &lt;/div&gt;);
  };
  
  ReactDOM.render(&lt;MyComponent name="doug" /&gt;, document.getElementById('root'));```
  </code></pre>