Question

我试图在运行代码以获取信息时将按钮更改为保存状态。

我有 this.setState({ saving: true }, () => this.save(event) })

在this.save，我有一个休息电话。从日志中我可以看到状态已更新，但是在网站上直观地看到该按钮并没有像更新后的值那样进入旋转圈。

是否有一种方法可以在运行回调函数之前强制执行更新渲染，或者有更好的方法来设置按钮以进行保存，而我进行远程调用可能会花费一些时间？

Answer 1

没有理由强制这样做。与实际保存同时更改状态：

<button onClick={() => this.save()}>save</button>

已配对：

save() {
  this.setState({ saving: true });
  remoteAPI.save({ 
    data: this.getSaveData(),
    credentials: this.getCredentials()
    ...
  }, response => {
    this.setState({ saving: false });
    if(response.error) {
      // ohnoes!
    } else {
      // nice.
    }
  });
}

反应setstate不渲染，直到回调完成

1 个答案: