与在 for 循环中使用 setState 更新状态有关的语法问题

Question

我正在尝试根据某些条件更新状态，这些条件包括赋予数组中特定对象的值。我尝试了各种语法，这些语法给了我一个错误，例如this.setState(this.state.destinations[i].map(destinations=>destinations.visibilityStatus=false))我知道我写的所有其他东西都在工作，除了 setState。在下面的代码中，您将找到相关函数，其当前语法更新所有对象的可见性状态，而不是特定对象。如何编写 setState 以便理论上以这种方式更新状态 this.setState (this.state.destinations.map(destinations=>destinations.visibilityStatus=false)) 或另一种编写方式（仍然不起作用）this.state.destinations[i].visibilityStatus===false

这里是函数的当前代码，如果您需要更多详细信息，请告知，但通常这已经足够了，因为它更多的是语法问题而不是逻辑结构问题。感谢您的宝贵时间：

updateDestinationsVisibilityStatus=()=>{
      for(var i =0; i<this.state.destinations.length; i++){
          for( var n=0; n<this.state.destinations[i].visibilityTime.length; n++){
          if(this.state.destinations[i].visibilityTime[n].visibility===false && this.state.timerString===this.state.destinations[i].visibilityTime[n].value)
          {  this.setState (this.state.destinations.map(destinations=>destinations.visibilityStatus=false))}

          else if (this.state.destinations[i].visibilityTime[n].visibility===true && this.state.timerString===this.state.destinations[i].visibilityTime[n].value)
          {  this.setState (this.state.destinations.map(destinations=>destinations.visibilityStatus=true))}
          console.log(this.state.destinations[i].visibilityStatus)

      }
    }

  }

Answer 1

在每个事件中，切勿对一个属性多次调用 setState。 它是异步的，状态不会立即更改。根据经验，如果您不止一次调用updater function，您应该确保传递它。

这是保存在你的情况下：

updateDestinationsVisibilityStatus = () => {
    let dest = this.state.destinations; // use local variable
    for (let i = 0; i < dest.length; i++) {
        for (let n = 0; n < dest[i].visibilityTime.length; n++) {
            if (dest[i].visibilityTime[n].visibility === false && this.state.timerString === dest[i].visibilityTime[n].value) {
                dest[i].visibilityStatus = false; // manipulate that local
            } else if (dest[i].visibilityTime[n].visibility === true && this.state.timerString === dest[i].visibilityTime[n].value) {
                dest[i].visibilityStatus = true;
            }
        }
    }

    this.setState({destinations: dest}); // write back to state
}