React setState 不立即更新

2023-12-13

我正在开发一个待办事项应用程序。这是有问题的代码的一个非常简化的版本。我有一个复选框:

 <p><input type="checkbox"  name="area" checked={this.state.Pencil}   onChange={this.checkPencil}/> Writing Item </p>

这是调用复选框的函数:

checkPencil(){
   this.setState({
      pencil:!this.state.pencil,
  }); 
  this.props.updateItem(this.state);
}

updateItem是一个映射到dispatch到redux的函数

function mapDispatchToProps(dispatch){
  return bindActionCreators({ updateItem}, dispatch);
}

我的问题是,当我调用 updateItem 操作和 console.log 状态时,它总是落后 1 步。如果该复选框未选中且不为 true,我仍然会将 true 状态传递给 updateItem 函数。我需要调用另一个函数来强制状态更新吗?


您应该调用第二个函数作为 setState 的回调,因为 setState 是异步发生的。就像是:

this.setState({pencil:!this.state.pencil}, myFunction)

然而,在您的情况下,由于您希望使用参数调用该函数,因此您必须更具创意,并且也许创建自己的函数来调用道具中的函数:

myFunction = () => {
  this.props.updateItem(this.state)
}

将它们结合在一起应该可以工作。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React setState 不立即更新 的相关文章

随机推荐