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

0 vote187 views1 answer
React native flexbox 2 columns 1 fixed width
Javascript React
2 votes153 views2 answers
How to add multiple classes to a ReactJS Component
Javascript React
23 votes170 views6 answers
React hooks useeffect
Javascript React
1 vote160 views1 answer
Is a good idea to add class in react hooks with document.body.addclasslist
Javascript React
0 vote173 views1 answer
Dlowlad the json fiel in react js pretty formate
Javascript React
3 votes157 views1 answer
React icons in nextJS
Javascript React
0 vote148 views1 answer
React native stopwatch
Javascript React
0 vote143 views1 answer
Images not displaying in react
Javascript React
0 vote154 views3 answers
Proptypes for a react component
Javascript React
0 vote157 views1 answer
Invariant Violation: [React Intl] An `id` must be provided to format a message.
Javascript React