title: React ref is only updating one instance
body: <p>Got an interesting problem withs refs.</p>
  <p>I'm mapping over a component and rendering it multiple times and passing a ref to each one</p>
  <pre><code>const ref = useRef()
  
  {data.map(d) =&gt; (
    &lt;Component
      {...lotsOfOtherProps}
      ref={ref}
    /&gt;
  )}
  </code></pre>
  <p>Then in a grandchild component I have:</p>
  <pre><code>  const anotherRef = React.useRef()
    useImperativeHandle(ref, () =&gt; ({
      reset: () =&gt; {
        anotherRef?.current.reset()
      },
    }))
  </code></pre>
  <p>In this component I have a button and when I toggle it I call</p>
  <p><code>anotherRef?.current?.reset()</code> and this works and does what I want</p>
  <p>but I'm wondering when I click a &quot;reset all&quot; button, how I can get all the refs to reset?</p>