useCallback
不断捕获其依赖项的错误值。
const [state, setState] = React.useState(0);
const callback = React.useCallback(() => {
console.log(state); // prints 0 why???????
}, [state]);
React.useEffect(() => {
setState(1);
return () => {
callback(); // only called here, clearly after the state is set to 1
};
}, []);
字符串
我希望能够从useCallback
回调中访问useCallback
依赖列表中的所有内容,而不会出现任何问题。
如果两者都产生相同的输出,那么不使用useCallback有什么区别:
const callback = () => {
console.log(state); // prints 0
};
型
注意:这也不起作用,因此“effect callback is capturing the“wrong”callback.”是false。
React.useEffect(() => {
setState(1);
return callback;
}, []);
型
useCallback显然没有捕获其依赖项的正确值
这是可行的,但不是我想要的:
使用ref而不是state(React.useRef)可以工作,调用state的setState函数并从该调用内部访问先前的也可以工作。但我不想这样做,我想直接访问state,因为根据文档,state应该是最新的。
1条答案
按热度按时间sz81bmfz1#
问题不在于
useCallback
,它可以工作并且具有正确的依赖关系。无论是有
useCallback
的版本还是没有useCallback
的版本,问题都在于您从一个效果钩子的cleanup函数中调用callback()
,而 that 效果回调函数正在捕获“错误的”callback
。我想直接访问状态,因为根据文档,状态应该是最新的。
不,
const state
不会(也不能)更新。参见The useState set method is not reflecting a change immediately,“stale closure”问题和useEvent
提案。你真的需要useRef
从第一次渲染时创建的旧闭包访问当前状态,没有办法。