为什么在this.state里面的数组连接不起作用？

Question

我正在尝试在键下面的组件状态中的数组中添加渲染日期date,但它总是返回0.

constructor(props) {
    super(props);
    this.state = {
      dates: []
    }
  }

  componentWillMount() {
    this.renderDateComp()
  }

  renderDateComp() {
    for(var i = 0; i < 5; i++) {
      var dat = new Date(Date().valueOf());
      dat.setDate(dat.getDate() + i);
      this.setState({ dates: this.state.dates.concat(dat) });
      console.log(this.state.dates); //prints length of 0
    }
  }

Answer 1

首先,状态转换不是立即的,它们是异步的(在大多数情况下).可以想象每次设置状态时,它会将状态更改添加到更改队列中,并且React会持续处理该队列,执行所有这些状态更改.因此,如果您更改状态,然后在下一行代码上立即打印状态,状态可能不会更改,因为在状态更改添加到列表后,控制台日志立即发生,但实际上在更改之前经历了这个队列.

其次,在for循环之后设置状态可能更好,所以你只需要设置一次,而不是5次.