React useState 取不到最新值？

Question

点击按钮后，useEffect可以监听到值最新的改变。而loadData却一直拿到的是上一次的值。
为什么呢？是人性的丧尸还是道德的泯灭？望大佬解惑！
下文小案例，复制就能跑：

import { useState, useEffect } from 'react'

export default function () {
  const [page, setPage] = useState({ current: 1, pageSize: 10 });
  function loadData() {
    console.log({ current: page.current })
  }

  useEffect(() => {
    console.log('发生了改变', page)
  }, [page])

  function onClick() {
    setPage((pre) => ({ ...pre, current: pre.current + 1 }))
    setTimeout(() => {
      console.log('加载数据时', page)
      loadData()
    }, 1000)
  }
  return <>
    <div>
      {JSON.stringify(page)}
      <p>测试页面</p>
      <button onClick={onClick}>添加</button>
    </div>
  </>
}

Answer 1

经典react hook的闭包问题，随便搜都有的
https://juejin.cn/post/6847902217031122951