useRef
Holds a mutable value or DOM reference that persists across renders.
Syntax
const ref = useRef(initialValue) Parameters
| Name | Type | Required | Description |
|---|---|---|---|
initialValue | any | Yes | The initial value of the ref object's current property. |
Returns
object — A stable object with a mutable current property.
Examples
function TextInput() {
const inputRef = useRef(null);
return (
<>
<input ref={inputRef} />
<button onClick={() => inputRef.current.focus()}>
Focus
</button>
</>
);
}
const renders = useRef(0);
renders.current += 1;
Notes
Mutating `ref.current` does not trigger a re-render. The ref object identity
is stable for the component's lifetime. Use it for DOM nodes, timers, or any
mutable value that should not cause renders. Do not read or write
`ref.current` during rendering.