React State 没有正确分配 setState [重复]

Posted 2023-02-21

【中文标题】React State 没有正确分配 setState [重复]

【英文标题】：React State is not assigning properly with setState [duplicate]

【发布时间】：2018-07-19 00:35:34

【问题描述】：

我正在创建一个非常基本的待办事项应用程序。但是我遇到了将 todos 推入数组并将它们分配给状态的问题。

  constructor(props)
    super(props);
    this.state = 
      todo : '',
      todos : []
    ;
  ;

  todoValue(todo)
    console.log(`Received the todo in the App : $todo`);
    this.setState(todo);
    console.log(this.state.todo);
  

当我点击一个按钮时，我在todo 函数的todo 参数中收到todo 值。但它不会分配给事件的状态。它确实将值分配给下一个事件的状态。

例如，如果我在第一个事件中收到了 one 的 todo 值，在下一个事件中收到了 two 的 todo 值，这就是我得到的。

我想将 todo 值分配给按钮单击时的状态（而不是下一个事件）

如何解决这个问题？

【参考方案1】：

setStateis an async operation but it does allow a callback to be triggered 操作完成时。将您的代码更改为

this.setState( todo , () => console.log(this.state.todo));

您会看到您对状态所做的最新更改。

【讨论】：

谢谢。有效。我不知道。

【参考方案2】：

setState 是异步的，因此 react 可以批量调用 setState 以提高性能。

如上所述，要么使用 setState 的回调函数，要么使用 componentLifeCycle componentDidUpdate

【讨论】：

谢谢。它奏效了。