useRef

The useRef Hook is used to persist values between renders of a component. It is used to pass a reference to a mutable value that does not cause a rerender when updated. It can also be used to access DOM elements directly. The useRef Hook is useful when we want to count the number of rerenders caused by an application. We cannot use the useState Hook to count and store the number of rerenders since the useState Hook itself causes the component to rerender. This will just trap us inside an infinite loop. Another use case for the useRef Hook is to access DOM elements, e.g., focusing text input boxes.

Usage

To implement and use the useRef Hook, we first have to import it from the react library.