Javascript 反应：更新的状态未反映在递归useCallback中

我在一个递归调用的useCallback钩子中递增foo。但是，递增的foo不会反映在回调中

const{useState，useCallback}=React； 常量应用==>{ const[foo，setFoo]=useState0； 常量recursiveCallback=useCallback=>{ //始终记录0 console.logfoo； //递增foo setfooo+1； 设置超时=>{ //递归调用 递归回调； }, 250; }，[foo]； 返回点击我； } ReactDOM.render，document.getElementById'root'； 试着换一行

setFoo(foo + 1);

到

试着换一行

setFoo(foo + 1);

到

您在日志和setter函数中都有一个on foo==0值，要修复该值，您需要使用和使用effect进行日志记录：

const{useState，useCallback，useffect}=React； 常量应用==>{ const[foo，setFoo]=useState0； 常量recursiveCallback=useCallback=>{ setFooprev=>prev+1； 设置超时=>{ 递归回调； }, 250; }，[foo]； useEffect=>{ console.logfoo； }，[foo]； 返回点击我； } ReactDOM.render，document.getElementById'root'； 您在日志和setter函数中都有一个on foo==0值，要修复该值，您需要使用和使用effect进行日志记录：

const{useState，useCallback，useffect}=React； 常量应用==>{ const[foo，setFoo]=useState0； 常量recursiveCallback=useCallback=>{ setFooprev=>prev+1； 设置超时=>{ 递归回调； }, 250; }，[foo]； useEffect=>{ console.logfoo； }，[foo]； 返回点击我； } ReactDOM.render，document.getElementById'root'； 您应该将useEffect与[foo]依赖项一起使用，以便在设置状态后查看更改。 更新foo的函数应该是 如果使用以前的状态计算新状态，则可以传递 函数设置状态 函数将接收上一个值，并返回更新的 价值观

注意：如果没有选择功能更新，会发生什么情况

如果选择setfooo+1；，下一个状态将仅为2，之后，状态不会更改，useEffect和dependency foo也不会受到影响

简而言之，如果您需要以前的状态，则必须使用函数更新

const{useState，useCallback，useffect}=React； 常量应用==>{ const[foo，setFoo]=useState0； 常量recursiveCallback=useCallback=>{ //递增foo //setfooo+1； setFoopreviousFoo=>previousFoo+1； 设置超时=>{ //递归调用 递归回调； }, 500; }，[foo]； useEffect=>{ console.logfoo； }，[foo]； 返回点击我； } ReactDOM.render，document.getElementById'root'； 您应该将useEffect与[foo]依赖项一起使用，以便在设置状态后查看更改。 更新foo的函数应该是 如果使用以前的状态计算新状态，则可以传递 函数设置状态 函数将接收上一个值，并返回更新的 价值观

注意：如果没有选择功能更新，会发生什么情况

如果选择setfooo+1；，下一个状态将仅为2，之后，状态不会更改，useEffect和dependency foo也不会受到影响

简而言之，如果您需要以前的状态，则必须使用函数更新

const{useState，useCallback，useffect}=React； 常量应用==>{ const[foo，setFoo]=useState0； 常量recursiveCallback=useCallback=>{ //递增foo //setfooo+1； setFoopreviousFoo=>previousFoo+1； 设置超时=>{ //递归调用 递归回调； }, 500; }，[foo]； useEffect=>{ console.logfoo； }，[foo]； 返回点击我； } ReactDOM.render，document.getElementById'root'；

---

setTimeout中使用的recursiveCallback指的是foo之前的值。嗨，Andrea，请用注释检查更新的问题：setTimeout中使用的recursiveCallback指的是foo之前的值。嗨，Andrea，请用注释检查更新的问题：嗨，Dennis，请用注释检查更新的问题：同样，在注释中，您在超时内关闭了recursiveCallback，即使它在useCallback内，您也无法阻止递归。你所做的似乎是，你应该发布一个你想解决的实际问题，而不是试图解决你的解决方案。我完全同意你的看法，丹尼斯先生Vash@DennisVash理解你的观点并用正确的问题更新了问题。@VinaySharma只需发布另一个问题。。。原来的问题已经有三个人回答了…嗨，丹尼斯，请用注释检查更新后的问题：同样，在注释中，你在超时时间内关闭了recursiveCallback，你不能阻止递归，即使它在useCallback内。你所做的看起来像是，你应该用

---

您想解决的实际问题，而不是试图解决您的解决方案我完全同意您的意见，先生@丹尼斯Vash@DennisVash理解你的观点并用正确的问题更新了问题。@VinaySharma只需发布另一个问题。。。三个人已经回答了原来的问题…你能分享更多关于为什么选择功能更新而不是setFoo的见解吗？我刚刚更新了我的答案，请先看看@vinaysharmafst，避免使用“Ok”，这没什么大不了的：因为它对解决方案没有帮助，只是增加了评论部分。第二，更新后的答案如果新状态是使用前一个状态计算的，您可以传递一个函数来设置该函数将接收前一个值，并返回一个更新后的值以回答函数更新的工作方式，而不是您选择它的原因。哦，不，我必须马上返回给您，而不是让您等待我。这就是为什么好吧，没什么大不了的。无论如何，我已经更新了我的答案，请再次检查！！！如果选择setFoofoo+1，则下一个状态将仅为2是非常不明确的，因为下一个状态应该为1，因为foo初始化为0。在下面的语句中，以及之后的语句中，状态没有更改，useEffect with dependency foo也不受影响。它没有回答状态没有改变的原因，而是陈述了一个已知的事实：你能分享更多关于为什么选择功能更新而不是setFoo的见解吗？我刚刚更新了我的答案，请先看看@vinaysharmafst，避免使用Ok，这没什么大不了的：因为它对解决方案没有帮助，只是增加了评论部分。第二，更新后的答案如果新状态是使用前一个状态计算的，您可以传递一个函数来设置该函数将接收前一个值，并返回一个更新后的值以回答函数更新的工作方式，而不是您选择它的原因。哦，不，我必须马上返回给您，而不是让您等待我。这就是为什么好吧，没什么大不了的。无论如何，我已经更新了我的答案，请再次检查！！！如果选择setFoofoo+1，则下一个状态将仅为2是非常不明确的，因为下一个状态应该为1，因为foo初始化为0。在下面的语句中，以及之后的语句中，状态没有更改，useEffect with dependency foo也不受影响。它没有回答状态没有改变的原因，而是陈述了一个已知的事实：虽然您的解决方案不起作用，但您是否可以分享更多关于为什么选择功能更新而不是setFoo的见解？尽管您的解决方案不起作用，您是否可以分享更多关于为什么选择功能更新而不是setFoo的见解？

    // incrementing foo
    setFoo(previousFoo => previousFoo + 1);