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

5 votes203 views4 answers
React route multiple components
Javascript React
0 vote183 views1 answer
React native star rating component
Javascript React
11 votes195 views3 answers
Reactjs get url query params as object
Javascript React
0 vote185 views1 answer
In whatsapp share text add a new line react
Javascript React
16 votes203 views1 answer
React native 0.60.4 xiaomi crashes at open
Javascript React
2 votes195 views1 answer
Remove header border react native
Javascript React
0 vote167 views1 answer
Import React from 'react'; import {Router, Scene} from 'react-native-router-flux';
Javascript React
0 vote170 views1 answer
Error React Hook "useStaticQuery" is called in function
Javascript React
1 vote179 views1 answer
Retour a la ligne <p> react
Javascript React
4 votes233 views2 answers
React filter array from another array
Javascript React