React JS设置状态仅适用于上一项

Question

我是React JS的新手。

我得到了以下代码：

const [tags, setTags] = React.useState([]);

并且有一些标签。如果单击标签，则会发生这种情况：

    const handleClick = (e) => {
      setTags([...tags, e]);
      console.log(tags)

“ e”是一个字符串，它是标签的值

但是我的问题是setTags，它没有将当前的“ e”添加到标签数组中。首次执行handleClick时，控制台日志行将为空。

如果单击另一个标签，则控制台日志将打印一个数组，其中包含先前单击的标签，但不包含当前的标签。我不了解这种行为。

Answer 1

反应状态更新是异步的。 通过添加对标签有依赖性的useEffect挂钩，我设法获得了想要的东西。

Answer 2

状态更新是异步的。试试这个：

const [tags, setTags] = React.useState([]);

const handleClick = (e) => {
  setTags([...tags, e]);
}

useEffect(() => {
  console.log(tags);
});