Simple React Refs Sample

Search.jsx

import { useState, useRef, useEffect } from 'react';

const Search = () => {
  const inputRef = useRef(null);
  const [name, setName] = useState('');

  useEffect(() => {
    inputRef.current.focus();
  }, []);
  
  return (
    <div>
      <input
        ref={inputRef}
        value={name}
        onChange={(e) => setName(e.target.value)}
      />
      <div>{name}</div>
    </div>
  );
};

export default Search;