Как обновить состояние внутри хука и прочитать его с другого

Question

У меня есть этот реагирующий компонент без состояния, первый useEffect должен запускаться после загрузки компонента, второй при прокрутке страницы, чтобы реализовать бесконечную прокрутку.

Я пытаюсь обновить состояние внутри useEffect, а затем использовать обновленное значение во втором:

const MyComponent = () => {
  const [state, setState] = useState({
    page: 1
  });

  useEffect(() => {
    setState({
        ...state,
        page: state.page + 1
    });
   }, []);

  useEffect(() => {

    if (window.innerHeight + document.documentElement.scrollTop !== document.documentElement.offsetHeight) {
            return;
        }
    console.log(state.page);

    window.addEventListener('scroll', handleScroll);
    return () => window.removeEventListener('scroll', handleScroll);
  }, []);

}

к сожалению, console.log показывает, что страница по-прежнемуВо-первых, даже если использовать консоль реагирования в Chrome, я вижу, что значение изменилось.

Я знаю, что useEffect не имеет состояния, поэтому console.log читает значение перед обновлением, в любом случае, как мне исправить это, чтобы прочитать обновленное значение?

Answer 1

Во втором использовании: useEffect(()=>{...},[state]);