'Compare value inside of use-deep-compare-effect

This is a part of use-deep-compare-effect source code

export function useDeepCompareMemoize<T>(value: T) {
  const ref = React.useRef<T>(value)
  const signalRef = React.useRef<number>(0)

  if (!deepEqual(value, ref.current)) {
    ref.current = value
    signalRef.current += 1
  }

  // eslint-disable-next-line react-hooks/exhaustive-deps
  return React.useMemo(() => ref.current, [signalRef.current])
}

In source code, compare the values like this.

export function useDeepCompareMemoize<T>(value: T) {
  const ref = React.useRef<T>(value)
  ...
}
  ...
  if (!deepEqual(value, ref.current)) {
  ...

deepEqual is a function that compares whether two parameters are deep equivalent.

I expect deepEqual(value, ref.current) to return always true. But it is not.

Why does this code work correctly?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source