发生场景
当在一个函数里面使用两次setState，且其中一个setState（val）的值val依赖于另外一个setState的结果的时候.
例子:codesandbox.io/s/react-hoo…
发生的原因
闭包陷阱:hooks 的闭包陷阱是指 useEffect 等 hook 中用到了某个 state，但是没有把它加到 deps 数组里，导致 state 变了，但是执行的函数依然引用着之前的 state。
重新创建函数意味着将使用最新的state值
带入到例子当中来看
const onBtnClick = useCallback(() => {
setList([...list, "item"]);
setVal(list.length * 2);
}, [list]);
在这个函数被声明的时候,使用的都是旧的list值
() => {
setList([...list, "item"]);
setVal(list.length * 2);
}
解决方案
- 使用useEffect，并使用正确的依赖项 codesandbox.io/s/react-hoo…
- 使用ref,获得最新的值 codesandbox.io/s/bi-bao-xi…
