create ref in functional component react code example

Example 1: when to use react ref

WHEN TO USE REACT'S REF ATTRIBUTE?
But it is not always a good idea to use the ref attribute. The general rule of thumb is to avoid it. The official React documentation mentions three occasions where you can use it because you have no other choice.

Managing focus, text selection, or media playback.
Integrating with third-party DOM libraries.
Triggering imperative animations.

Example 2: cre&atRefs react js

const node = this.myRef.current;

Example 3: createref in functional component

function CustomTextInput(props) {
  // textInput must be declared here so the ref can refer to it
  const textInput = useRef(null);
  
  function handleClick() {
    textInput.current.focus();
  }
  
  return (
    <div>
      <input
        type="text"
        ref={textInput} />
    </div>
  );
}