Reactjs 我的React state对象仅在第二次尝试时设置，为什么？

我目前遇到了一个问题，我将项目的大小传递给

this.state.taked\u size

，然后用订单创建订单项目或更新现有订单（仅供理解）

因此，当我在我的

console.log（）

中获取大小时，我看到它获取所需的值并进行设置，但当我在字段中传递该大小时，它会显示类似

this.state.taked\u大小未定义的内容。但是，当我第二次单击时，我的大小被传递到字段中，并且它起作用

下面是我的代码

    takeSize(event){
        event.preventDefault()
        const taken_size = event.target.value
        console.log(this.state.taken_size)
        this.setState({
            taken_size:taken_size
        })
    }



    handleAddingToCart(event){
        event.preventDefault(event)
        console.log(this.state.taken_size)
        axios.post('http://127.0.0.1:8000/api-o-i/create/', {
            item: this.state.item.id,
            user: localStorage.user_pk,
            size: this.state.taken_size, 
        }).then(res => {
          // Do other things
        })
    }

和我的html代码：

<form onSubmit={this.handleAddingToCart}>
  <div className="product-options">
    <label>
      Size 
        <ul class="product__size-list">
          {this.state.all_sizes.map((size) => {
            return <div>
              <div onClick={this.takeSize} className="product">  
                <li value={size.pk} class="centered" >
                  <span value={size.pk}>{size.size}</span>
                </li>       
              </div>
          </div>
        })}
      </ul>
    </label>
  </div>
  <div className="add-to-cart">
    <button htmlType="submit" className="add-to-cart-btn">
      <i className="fa fa-shopping-cart"></i> add to wishlist
    </button>
  </div>
</form>


大小

{this.state.all_size.map（（size）=>{
返回

{size.size}

})}

添加到愿望列表

如果需要其他内容，请随时询问。
您可以在组件类的构造函数中初始化初始状态，这样它就不会像这样未定义

class MyComponent extends React.Component {
    contructor() {
        super();
        // set the initial state
        this.state = {
            taken_size: 0 //or null or whatever you want
        };
    }

    /*

      Other code

     */
}

此外，在设置将记录上一个状态的状态之前，您正在进行日志记录<代码>设置状态

是异步的。因此，如果要在更新状态后执行某些操作，可以使用回调作为

setState

的第二个参数

 takeSize(event){
    event.preventDefault()
    const taken_size = event.target.value

    this.setState({
        taken_size:taken_size
    },()=>{
        console.log(this.state.taken_size)
    })
}

---

希望这有帮助

您可以在组件类的构造函数中初始化初始状态，这样它就不会像这样未定义

class MyComponent extends React.Component {
    contructor() {
        super();
        // set the initial state
        this.state = {
            taken_size: 0 //or null or whatever you want
        };
    }

    /*

      Other code

     */
}

此外，在设置将记录上一个状态的状态之前，您正在进行日志记录<代码>设置状态是异步的。因此，如果要在更新状态后执行某些操作，可以使用回调作为

setState

的第二个参数

 takeSize(event){
    event.preventDefault()
    const taken_size = event.target.value

    this.setState({
        taken_size:taken_size
    },()=>{
        console.log(this.state.taken_size)
    })
}

---

希望这有帮助

今天我看到了很多关于这个标题的问题，state是异步的，放置settimeout没有时间，再试一次。今天我看到了很多关于这个标题的问题，state是异步的，放置settimeout没有时间，再试一次