Current property

As explained in React Quickly, Second Edition

The current property is the mutable property on a useRef return object that stores its current referenced or retained value.

The current property, written .current, is the mutable value stored on a useRef return object. Read it to retrieve the retained value and assign it to update that value without triggering a re-render. section 7.1.3

Track the last click without rendering

const lastClickTime = useRef(null); const onClick = () => { const isDoubleClick = Date.now() - lastClickTime.current < THRESHOLD; if (isDoubleClick) { setCounter((value) => value + 1); } else { lastClickTime.current = Date.now(); } }; Use .current for internal values such as the previous click time when changing the value should not update the JSX.

Figure 7.2 This time, if the user clicks the button the first time, the last click time is recorded, but it doesn’t cause a re-render because it’s not an active state value, but a passive one. This means that we can still access the value later (on this or future renders), but it doesn’t cause a new render by itself.

Shows how a value remains available on later renders while updating it does not independently trigger a new render. section 7.1.3

How React Quickly, Second Edition covers it

How deep it goes

Explains reading and assignment through .current, contrasting reference updates with state updates and showing DOM references.

Examples

Uses a double-click counter, a retained click timestamp, and an autofocus input reference.

What you can do after

Apply via React's useRef hook to retain values or access DOM elements without causing re-renders.

How it connects

Connects useRef with state, rendering, effect hooks, and DOM elements.

liveBookmanning.com

Read React Quickly, Second Edition on liveBook Get the book at manning.com

Also explained in

• 

  liveBookmanning.com
  React Hooks in Action: With Suspense and Concurrent ModeA ref current property is the mutable property on a React ref object that contains its current referenced value or DOM element.

Compare how 2 books explain current property →

Related concepts

• useRefused by · useRef is a React Hook that returns a persistent mutable object whose current property can hold a value across renders without causing re-rendering when changed.
• refpart of · A ref is a mechanism for retaining access to a rendered element, component, or value outside ordinary rendering data flow.

This explainer was generated by Manning's knowledge graph from the text of React Quickly, Second Edition. The section links point to the parts of the book it draws on.