Reactjs中的套接字，长轮询和异步

Question

我正在构建一个应用程序，它将触及api端点，返回以下内容：

[
  {batchName: "wqrs1", totalJobs: X1, numErrJobs: Y1, numCmpltJobs: Z1, inFlightJobs: K1},
  {batchName: "wqrs2", totalJobs: X2, numErrJobs: Y2, numCmpltJobs: Z2, inFlightJobs: K2},
  {batchName: "wqrsN", totalJobs: XN, numErrJobs: YN, numCmpltJobs: ZN, inFlightJobs: KN},
]

从api端点/get-all-batches使用Reactjs在仪表板中显示（我很新）。我想要了解的是当X，Y，Z，K中的一个值发生变化时，如何更新我的反应存储/状态。有人可以区分套接字，长轮询或异步/等待吗？这是我应该看到做的这种事情吗？

Answer 1

你可以参考这个（答案和帖子）：https://stackoverflow.com/a/53749735/2269464。答案包含有关您从React开始的有用见解。

一旦.on("value"..触发，最重要的部分是setState调用。

export default ...... extends Component {
  constructor() {
    this.state = {
      currentToken: 'first value'
    }
  }

  componentDidMount() {
      var that = this;
      var updateDb = firebase.database().ref("currentToken");
      updateDb.on("value", function(snapshot) {
          that.setState({ currentToken: snapshot.val() });
      });
  }

那个（setState）会告诉组件重新渲染，所以如果你有下面的代码，你将首先看到first value，当firebase触发时，你将通过react重新为你渲染新的值：

render() {
  return <div>{this.state.currentToken}</div>
}