将第一个元素保存到待办事项中的数组时出现问题

Question

我在使用 React-hooks 的 React 中使用简单的待办事项应用程序时遇到问题。

当我获取我的 inputValue 并尝试将其分配给对象并保存到我的项目数组时，它不起作用。

( onSubmit 操作后的第一个赋值是空数组，我完全不知道为什么。但是第二个按钮操作工作正常。

有人可以帮我解决这个问题吗？

Answer 1

问题是您在设置新项后立即执行 console.log，但 React 会在新项上进行更新 re-render，因此您看不到组件之前的更改 re-renders.

要进行测试，您可以通过在 button 元素下方添加以下内容来呈现当前项目：

          <p>Got items:</p>
            {items.map((item, i) => (
              <div key={i}>{item.name}</div>
            ))}
          </div>

Answer 2

您可以在 useEffect 挂钩中执行此类副作用（如 console.log），它会在每次 items 变量更新后运行记录正确的事情

useEffect(() => {
    console.log(items);
  }, [items])

Problem with saving first element to array in todo