What is the difference between useState and useRef in React?

What is the difference between useState and useRef in React?

useState is used to manage state in functional components, while useRef is used to persist values across renders without causing re-renders.

Can you give me an example of when to use useRef?

Sure! You can use useRef to access a DOM element directly, like focusing an input field without triggering a re-render.

Does useRef hold a mutable value?

Yes, useRef can hold a mutable value that persists for the full lifetime of the component, unlike state.

When should I prefer useState over useRef?

You should prefer useState when you need to trigger a re-render on state change, while useRef is for values that don't need to cause re-renders.