React hook，更新后直接访问 state 值

Question

我知道这已经被问了很多，并且以许多不同的方式，但我找不到适合我的东西。 我想要在我的代码中的功能是这个

const TestApp() => {
  const [count, setCount] = useState(null);
  const updateAndShowCount = () => {
    setCount(count + 1);
    // This console.log should be happen after setCount() has completed it's job
    console.log(count);
  }
}

function 将通过按钮 onClick 效果调用。 它目前所做的是更新count并在更新之前打印count的值。

我希望按下按钮来更新count并立即“在”打印更新后的值。

这是一个实现我想要的测试用例，在我的实际项目中，function 将从输入字段接收一个值，然后使用该值（使用 axios）发出获取请求。 我假设这个简单测试用例的答案也适用于我的案例，并且由于这种异步行为是我不太了解的东西，但我认为首先掌握一般概念是明智的。

从我收集到的信息来看，我想我应该提到useEffect()已经被用于初始获取请求，所以如果你的答案涉及使用它，你应该假设我不知道如何向useEffect()添加一些东西同时保留其当前功能。

当前的useEffect() ：

useEffect(() => {
  axios.get("mybackend/").then(res) => {
    setRequestData(res.data);
  });
}, []);

为了清楚起见，我的实际问题以粗体显示。 也欢迎任何有关整体情况的信息。 谢谢阅读！

Answer 1

当向您的请求添加count时，解决方案自然会遵循（我猜它是某种查询参数），因为当您在效果中使用count时，它是效果的依赖项，因此每当依赖项发生变化时，效果就会运行再次：

useEffect(() => {
  axios.get("mybackend?count=" + count).then(res) => {
   setRequestData(res.data);
  });
}, [count]);

请注意，效果仍然缺少清理回调，这将取消正在进行的请求，因此当请求仍在进行时count再次更改时，不会有两个请求同时运行。

Answer 2

我不确定我是否完全理解您的问题，但我认为答案是：您应该在 setState 中使用回调，如下所示：

setCount(count => count + 1)