react 新手关于 react useEffect 的困惑，为什么 useEffect 里面的 cleanup 函数里面的 props 是旧的，如何从源码解释？

版本： react@18.3.1

我看源码就是先 UnmountEffects 后 MountEffects,里面也只是递归遍历而已，为什么 cleanup 里面的 props 是上一次的了？

commitPassiveUnmountEffects(root.current);
commitPassiveMountEffects(root, root.current, lanes, transitions);

// 复现的 demo
function App() {
  const [num, setNum] = useState(100)
  window.__setNum = setNum
  return <Comp num={num}></Comp>
}

function Comp(props) {
  debugger
  useEffect(() => {
    debugger
    props // {num:1000}
    return () => {
      debugger
      // 为什么这里是旧的 props? {num:100}
      props
    }
  }, [props.num])
  return (
    <p>
      <span>{props.num}</span>
    </p>
  )
}

setTimeout(() => {
  __setNum(1000)
}, 1000)

闭包

新状态组件的 useEffect 和旧状态组件的 cleanup 同时被你 debugger 到了

@shintendo 从 chrome 的 debugger 工具看，这个 props 确实是来源于闭包，thanks!!

我这里也有一个闭包的问题，https://codesandbox.io/p/sandbox/zuo-yong-yu-de-wen-ti-kvt3jp?file=%2Fsrc%2FApp.js react 的函数组件让人恼火，各种潜在的问题

@ltaoo1o #4 你比 OP 还新手 https://i.imgur.com/Iy0taMy.png

@Razio 可以详细说说吗，不要只输出态度..

@ltaoo1o #4 就是闭包的问题。每次组件状态变化，函数都会执行一次。所以最新的状态都在最新的一次执行里。但是这里你 keydown 监听的是第一次函数运行的函数。那个函数的闭包上下文里，state 是最初的。 新手不要直接用 useEffect 。找个 react-use ahook 啥的。用封装好的 hook 。无论什么水平，写的好的话，需要手写 useEffect 的很少

@ltaoo1o 你这个我觉得无解，可行的解法你自己注释里都写了 或者干脆就从 dom 里拿 v

（变量）代码在写下来的时候就被捕获了。或者说，在这个函数的生命周期里，函数内部的那个 props 就只有传入的 props