React, почему в useState(value) в кастомном хуке не попадает новое значение? Какой тут исп. механизм?

Question

[bzotsss]

Всем привет , есть такой код , коменты в нём обьясняют ситуацию . Вот ещё кодсандбох - https://codesandbox.io/s/use-is-mounted-49fxl?file... :

import { useState, useRef, useEffect } from "react";

function useLatestValue(val) {
  const ref = useRef();

  useEffect(() => {
    ref.current = val;
  });

  return ref;
}

function useDebounce(value, delay) {
  console.log("entry value ( new )", value);
  const [debouncedValue, setDebouncedValue] = useState(value);
  console.log("return value from debouncedValue ( old )", debouncedValue); // тут старое значение , ПОЧЕМУ?? 
//По идее , наш хук должен перевызыватся с новым значением value и 
//в useState(value - тут value - новое значение,разве нет ? ) должно попадать новое значение , разве нет ? 
  const effectRef = useLatestValue({ clearTimeout, delay });

  useEffect(() => {
    const handler = setTimeout(() => {
      setDebouncedValue(value);
    }, effectRef.current.delay);

    return () => {
      clearTimeout(handler);
    };
  }, [value, effectRef]);

  return debouncedValue;
}

export default function App() {
  const [inputValue, setInputValue] = useState(false);

  const debouncedValue = useDebounce(inputValue, 1000);

  return (
    <div>
      <input
        onChange={(e) => setInputValue(e.target.value)}
        placeholder="input"
      />
    </div>
  );
}

Может кто нибудь пожалуйста обьяснить почему в данном случае в useState ( в хуке useDebounce ) не попадает новое значение ? Всё работает как должно , просто интересно почему там нет нового значения .. Своё предположение я оставил в коде ..

Comments

[szQocks]

когда ты вызываешь

console.log("return value from debouncedValue ( old )", debouncedValue);

Показывает старое значение потому что новое значение будет записано туда только через delay промежуток времени

и использование

function useLatestValue(val) {
  const ref = useRef();

  useEffect(() => {
    ref.current = val;
  });

  return ref;
}

мне кажется лишним , ухудшает читабельность