Advanced React Patterns With Hooks/

...

/

Keeping Value Constant

Keeping Value Constant

We'll cover the following...

Using useRef to Ensure Value Remains Constant

The solution to this problem is simple. We can use the useRef hook to ensure that a value stays the same throughout component’s entire lifetime.

Here’s how it works:

//correct implementation
  const componentJustMounted = useRef(true)
  useEffect(
    () => {
      if (!componentJustMounted.current) {
        onExpand(expanded)
      }
     componentJustMounted.current = false
    },
    [expanded]
  )

...