Question

对于我的React App的一部分，我想实时更新我的数据。目前，我有一个fetchPosts动作，谁的reducer返回类似

{
  searchQuery1: {
    // any data I need
  },
  searchQuery2: {
    // any data I need
  }
}

其中每个searchQuery对应于一个呈现的<Column />组件，该组件显示获取的数据。

现在，如果我想通过基本上以循环方式向后端发送请求并等待数据更改并进行相应处理来实时更新此数据，我是否只需将setInterval()函数放在{{1 }}函数在我的componentDidMount()组件中，该函数调用用于处理实时数据更新的操作？

谢谢！

Answer 1

我同意您的意见。但是，如果您设置了setInterval()函数，则可能会引起问题。如果应用程序的网络阻塞，则可能会导致发布无用请求的问题。所以我认为您可能需要在setInterval()函数中设置一个阈值。该阈值的功能是，如果该应用未完成其最后一个请求，则它将不会发布新的请求。

Answer 2

为什么不尝试这样的事情？

class Column extends Component {
  componentDidMount() {
    this.intervalId = setInterval(this.refreshData, 1000);
  }
  refreshData = () => {
    // dispatch your action action here
  }

  componentWillUnmount() {
    // use intervalId to clear the interval
    clearInterval(this.intervalId);
 }
  render() {
    return <div>{/* Your code goes here*/}
    </div>
  }
}

别忘了清除componentWillUnmount中的间隔。

希望对您有帮助

连续获取数据以更新状态

2 个答案: