代码之家  ›  专栏  ›  技术社区  ›  theJuls

除非将整个对象传递给它,否则this.setstate不会更新状态。

  •  1
  • theJuls  · 技术社区  · 6 年前

    我有一个组件,其中我有一个具有一些属性的状态。构造函数如下所示:

    constructor (props, context) {
      super(props, context)
    
      this.state = {
        property1: '',
        property2: '',
        property3: '',
      }
    }
    

    说我想更新 property1 我通常会这样做:

    this.setState({property1: 'my new property1'})
    

    然而,这不起作用,价值 属性1 不会改变。要更新任何州,我必须执行以下操作:

    let obj = this.state
    obj.property1 = 'my new property1'
    this.setState(obj)
    

    我知道以前的工作方式没有问题。有什么变化吗?在某些情况下,我不能简单地设置每个州的财产吗?

    1 回复  |  直到 6 年前
        1
  •  5
  •   Matt H    6 年前

    设置状态异步工作。如果调用setstate,然后立即检查该值,它将不会更新。

    this.setState({property1: 'my new property1'});
    console.log(this.state.property1); //old value
    

    如果要等待新值,可以使用setState中的回调参数

    this.setState({property1: 'my new property1'}, () => {
        console.log(this.state.property1);
    });
    

    当使用整个对象时,看到状态更新的原因是通过编辑状态来改变状态,这很糟糕。