为什么异步函数中不更新响应钩子值？[重复]
在运行run函数时，我希望value变量的值为“new”，但即使是500毫秒，它仍然是“old”。为什么会发生这种情况，如何解决这个问题？
js prettyprint-override">import React, { Component, useState } from "react";
import { render } from "react-dom";
function App() {
const [value, setValue] = useState('old');
const run = async() => {
setValue('new')
const data = await wait(500)
console.log(value)
}
return (
<button onClick={run}>
Run
</button>
);
}
render(<App />, document.getElementById("root"));
function wait(ms) {
return new Promise(resolve => setTimeout(resolve, ms))
}
共有3个答案
好的，下面是我认为正在发生的事情：你点击按钮，它调用你的run函数——然后run函数调用setState。
- 我认为setState应该会导致组件重新加载新值，如果您在某处显示该值，该值将立即显示。因此，如果您想立即看到更改，请添加一个显示。
- 当您在setState之后立即登录run函数时，组件尚未重新加载，这意味着您仍在查看旧值。
- 当组件重新加载时，您不会看到控制台记录的值，因为没有再次调用run函数。单击按钮两次应该会记录新值，因为此时组件已使用该新值重新提交
在您的例子中，const[value，setValue]=useState（'old'）
设置值与类组件中的设置状态完全相同。因此，由于setState和setValue是异步函数，因此永远无法预测值何时更新。
因此，您可以在类组件中使用componentdiddupdate，或者像useffect（（）=
希望能有所帮助不要怀疑
setState异步运行，因此不会立即反映在功能代码块中。您可以尝试使用useEffect来观察状态的变化。
useffect（）=
-
我尝试了示例，如下所示：
-
我有一个异步函数，它调用其中的另一个异步函数。此异步函数正在返回" 你能帮我解决这个问题吗？ 以下是第一个异步函数： 如你所见，我调用updateAllProducts函数，并将该值存储到一个变量调用newAllProducts. updateAllProducts是另一个异步函数。 以下是updateAllProducts的代码： 此updateAllProducts函数正在调用另一个异步函数调
-
以下onClick回调函数将导致1次重新呈现： Reaction将所有三种状态的变化聚集在一起，并导致1个重新生成器。 您可以使用这个CodeSandBox来体验这种行为。
-
我是java新手，所以请不要后悔java中的对象和东西正在传递引用的值，但下面是我试图传递对象的代码。当我通过传递到函数中更新值时，a的值没有改变。发生了什么请帮助我。。。
-
问题内容： 就像一个人在这里问到但他的解决方案是调用其他函数 …我想知道是否有可能拥有一个不调用a的函数第二个功能基于异步请求的响应，但仅当异步请求响应时。 可能是这样的： 不调用另一个函数，这有可能吗？ 我要实现的目标是拥有一个可以用一些参数调用的函数，该函数将返回异步Web服务（如FB）的响应。 问题答案： 简而言之，没有。您不能让异步函数同步返回有意义的值，因为该值当时不存在（因为它是在后台
-
问题内容： 我的代码： 当我尝试运行这样的东西时： 我越来越： 但为什么？ 我的主要目标是将令牌（从令牌中返回承诺）转换为变量。然后才执行一些操作。 问题答案： 只要其结果尚未解决，promise将始终记录未决。无论promise状态如何（已解决或仍处于待处理状态），您都必须调用promise来捕获结果： 这是为什么？ 承诺只是向前的方向；您只能解决一次。a的解析值传递给其或方法。 根据Promi