Array of refs react

import React, { useRef, useEffect } from 'react';
import ReactDOM from 'react-dom';

const words = ['Many', 'Words'];

const App = () => {
  const wordsRef = useRef([]);

  const displayWords = words.map((word, i) => (
    <React.Fragment key={i}>
      <span ref={el => (wordsRef.current = [...wordsRef.current, el])}>
        {word}
      </span>
    </React.Fragment>
  ));

  useEffect(() => {
    console.log(wordsRef);
    console.log(wordsRef.current[0].classList);
  });

  return <div>{displayWords}</div>;
};

ReactDOM.render(<App />, document.getElementById('root'));

Source: stackoverflow.com

Similar codes

1 vote399 views1 answer
How to execute function without using onclick on react code example
Javascript React
0 vote297 views6 answers
Replace all in react js
Javascript React
13 votes361 views1 answer
Reactjs useState() hook
Javascript React
-1 vote349 views2 answers
How to connect react to backend
Javascript React
0 vote350 views1 answer
React fetch request with content type x-www-form-urlencoded
Javascript React
0 vote358 views1 answer
How to redirect a form to another page when we submitted a form in react js
Javascript React
1 vote343 views1 answer
React spread operator
Javascript React
0 vote338 views1 answer
React hook form submit outside form
Javascript React
0 vote344 views1 answer
Assign random colors react chartjs
Javascript React
0 vote352 views1 answer
Npm react-native-async-storage
Javascript React