Adding React Refs to an array of items

Date Published:

View On Medium

React refs are useful for when we have to amending elements when focus needs to be set on an element which was triggered from a state change or prop updates. In my case, I needed to use refs for setting focus to the correct button when I selected/used arrow keys on my tabs component.

Here is a basic example of a react component creating multiple refs based on the props that were passed into it:

And that is pretty much it, you can now get access to this['button-1'] and it will get you the button that was assigned in the map function.

Back to blogs