Reactjs 您将使用哪个组件生命周期来更新从api接收的数据

在初始装载时，我将从api获取数据并将其设置为状态

state={url:'someurl' , stockData=[], error:false}

用于获取数据和设置stockData状态的函数

      componentDidMount() {
        this.getDataFromApi();
      }

这些数据总是在变化我如何才能获得实时更新

我尝试使用componentWillUpdate来比较当前和下一个状态，并使用延迟为3秒的setTimeOut，这样它就不会这么快调用fetchData，但延迟不起作用，而且在短时间内调用fetchData的次数太多

    getDataFromApi = () => {
        fetch(this.state.url)
          .then(res => res.json())
          .then(
            res => {
              const sortedRes = res["results"].sort(function(a, b) {
                return b.ask_price - b.bid_price - (a.ask_price - a.bid_price);
              });
              this.setState(
                {
                  stockData: sortedRes
                }
              );
            },
            res => this.setState({ error: true })
          );
      };

setTimeout不起作用的原因是您没有阻止每个调用的发生。你只是把每一个都延迟了3秒。我建议将整个Api调用放在componentDidMount中的setInterval中

记住在组件卸载时也要进行内务管理，否则即使组件从DOM中移除，setTimeout也不会停止

componentDidMount() {
  this.apiCall = setInterval(() => {
    this.getDataFromApi();
  }, 3000)
}

---

你的设置超时是什么样子的？话虽如此，我很确定您会想要setInterval.updated问题@Andrew@Omar为了使用clearInterval，您需要一个对setInterval的引用，clearInterval实际上可以从事件循环中获取并删除该引用。命名它仍然会调用它。在任务期间。好的，但我的组件将保持更新，还是我将其删除？@Omar remove。getDataFromApi将在您的组件装载后继续调用自己，而不需要您的终端进行任何干预。

componentDidMount() {
  this.apiCall = setInterval(() => {
    this.getDataFromApi();
  }, 3000)
}

componentWillUnmount() {
  clearInterval(this.apiCall);
}