There are two use cases of useRef:
- Directly access DOM nodes to perform DOM operations imperatively
- Persist a value across rerenders, throughout the full lifetime of a component instance
The second use is particularly powerful when combined with useEffect, useState and useCallback. In this post, we used it in two real-world scenarios:
- Preserve previous state
- Preserve the reference of a timeout or interval so that we can clear them at a later time (in another render round)