Javascript 单击event.target.innerHTML时做出异常反应

我正在尝试获取React组件中按钮上单击事件的e.target.innerHTML，并将其指定给另一个常量trought setState，但是：

第一次单击时，e.target.innerHTML本身正确显示，但asigned状态值未定义

在第二次单击时，正确显示指定的状态值

如果我单击列表中的另一个按钮，则显示的值是上一个单击的按钮的值

如果我再次单击“新建”按钮，则会正确显示指定的状态值

此处的所有组件代码：

function categoryClickHandler（e）{
e、 预防默认值（）；
const collection=e.target.innerHTML；
setCurrentCollection（集合）；
log（e.target.innerHTML，“被点击了！”）；
控制台日志（集合，“集合”）；
log（“当前集合为：”，currentCollection）；
}
const listItems=category.map（（category）=>(

{category.name}

));
返回(
{currentUser&&单击某个类别开始测验！}
{！currentUser&&注册以开始测验！}
{listItems}
);
}

您的状态设置正确，没有问题。问题是，您在设置状态后直接读取它<代码>设置状态（）并不总是立即更新组件。它可能会将更新批处理或延迟到以后，这使得在调用

setState（）

之后立即读取

this.state

成为一个潜在的陷阱。因此，如何在状态更新后直接读取状态。因此，在您的情况下，当您使用一个功能组件时，您可以使用useEffect并监听状态的更新

useEffect(() => {
      console.log("Current Collection : ", currentCollection);
    },[currentCollection])

---

你可以在沙箱上查看它

根本不清楚你到底想解释什么？您是在谈论console.log（“当前集合是：”，currentCollection）没有打印您单击的按钮的预期值？如果是，那是因为

setCurrentCollection（collection）是异步的，您可能会看到以前更新的值。谢谢。它是有效的。@PlamenPetrov如果正确回答了您的问题，请勾选它作为正确答案。因此，如果有人来问这个问题，他/她就会知道这个问题已经得到了回答。