reactJS： setState（）值呈现在console.log但不更新状态

Question

这里我遇到了setState（）的小问题。我知道这是一个异步函数。我也使用了SO示例中的一些示例，我在console.log（）中获得了我的值，但这个值在状态中没有更新。

我需要在这里更改什么来获得更新的state（）值。请给我任何建议。

这里在我的代码选项卡更改状态值应该更新为表单提交。

//代码

handleOnSubmitJoinUS(e) {
    e.preventDefault();
    const { name,  phone, email, comment, activeTab } = this.state;

    if (activeTab == 0 ) {

        this.setState({comment: "Message for : Becoming a team member"}, () => {
            console.log(this.state.comment);
        });

    } else if (activeTab == 1) {
        this.setState({comment: "Message for : Becoming a Vendor Partner"}, () => {
            console.log(this.state.comment);
        });

    } else {
        this.setState({comment: "Message for : Becoming a Designer Associates"}, () => {
            console.log(this.state.comment);
        });
    }
    
    
    const sendingMsgData = {
        name,  phone, email, comment
    }

    //attempt to login
    if (sendingMsgData.email && sendingMsgData.name && sendingMsgData.phone  != null  ) {
        this.setState({msg : "Thank you! we recieved your submission successfully, we will surely contact you within 24 hours"});
        window.setTimeout(function(){window.location.reload()}, 1000);
    } 
    this.props.sendingConsultation(sendingMsgData);
    
}

Answer 1

正如您所说，setState是异步的，所以函数的其余部分继续运行，在状态实际上在this.state中设置之前完成所有消息发送等等。对于您的原始代码，这意味着代码的其余部分应该在setState后回调中。

但是，它看起来根本不需要处于状态，因为它是从状态中派生出来的。activeTab：

handleOnSubmitJoinUS(e) {
  e.preventDefault();
  const { name, phone, email, activeTab } = this.state;
  let comment;

  if (activeTab == 0) {
    comment = "Message for : Becoming a team member";
  } else if (activeTab == 1) {
    comment = "Message for : Becoming a Vendor Partner";
  } else {
    comment = "Message for : Becoming a Designer Associates";
  }

  const sendingMsgData = {
    name,
    phone,
    email,
    comment,
  };

  //attempt to login
  if (sendingMsgData.email && sendingMsgData.name && sendingMsgData.phone != null) {
    this.setState({ msg: "Thank you! we recieved your submission successfully, we will surely contact you within 24 hours" });
    window.setTimeout(function () {
      window.location.reload();
    }, 1000);
  }
  this.props.sendingConsultation(sendingMsgData);
}

如果出于某种原因确实需要它处于状态，那么可以在最后执行this.setState（{comment}）。