javascript - 国家直到第二次提交表格才更新

因此，当添加会话并提交表单时，我希望将客户端的价格转移到会话状态中。这就是我在此处的代码这一部分要尝试的操作。

state = {
    id: null,
    name: null,
    duration: null,
    dayOfWeek: null,
    price: null
  }

handleSubmit = (e) => {
    e.preventDefault();
    let newPrice = 0;
    this.props.clientList.filter(client => {
      if (client.name === this.state.name)
      {newPrice = client.price}
      this.setState({
        price : newPrice
      });
      console.log("price = " + this.state.price, 'newPrice = ' + newPrice)
    })
    this.props.addSession(this.state);
    e.target.reset();
    this.setState({
      id: null,
      name: null,
      duration: null,
      dayOfWeek : null
    });
  }

发生了什么，我尝试描绘控制台的图像，并添加了两个会话，这是当我第一次添加它时，它注销了price = null和newPrice = 40，第二次则是price = 40。为什么我的代码在这里不起作用？

如果需要，我可以添加更多代码。让我知道您需要看什么，谢谢！

最佳答案

setState是一个异步函数...您正在通过直接在setState之后调用以下行来访问旧状态值：

this.props.addSession(this.state);

--

handleSubmit = (e) => {
  e.preventDefault();
  let newPrice = 0;
  this.props.clientList.filter((client) => {
    if (client.name === this.state.name) {
      newPrice = client.price;
    }

    this.setState({
      price: newPrice,
    });
    console.log(`price = ${this.state.price}`, `newPrice = ${newPrice}`);
  });

  this.props.addSession({ ...this.state, price: newPrice }); // <- Look at this
  e.target.reset();
  this.setState({
    id: null,
    name: null,
    duration: null,
    dayOfWeek: null,
  });
};

关于javascript - 国家直到第二次提交表格才更新，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/55555279/