如何将此刷新操作调用为连续后台作业

您可以创建一个连续调用 setTimeout ,并在卸载组件时停止:

例子

class Counter extends Component {
  runRefresh = () => {
    this.timer = setTimeout(() => {
      this.props.refresh();
      this.runRefresh();
    }, 1000);
  };

  componentDidMount() {
    this.runRefresh();
  }

  componentWillUnmount() {
    clearTimeout(this.timer);
  }

  render() {
    const { refresh, counter } = this.props;
    return <button onClick={() => refresh()}>Refresh</button>;
  }
}

我假设您需要在应用程序中定期刷新。

所以在 redux 你可以写的动作创造者: 在这里 refreshInterval 在Action Creator中定义。

startRefresh(){
  refreshIntervalId = window.setInterval(() => {
    refresh();
  }, 3000);
}

或者如果您只是从返回action对象 refresh 那么你应该使用 redux-thunk

startRefresh => dispatch => (){
  refreshIntervalId = window.setInterval(() => {
    dispatch(refresh());
  }, 3000);
}

你可以叫这个 startRefresh 在 componentDidMount 主应用程序组件的生命周期方法或来自您希望的组件的生命周期方法。

componentDidMount(){
    this.props.startRefresh()
}

你也应该把 id 并清除此间隔 componentWillUnmount 生命周期方法。

componentWillUnmount(){
    this.props.clearRefreshInterval()
}

clearRefreshInterval 只会是:

clearRefreshInterval(){
    window.clearInterval(refreshIntervalId);
}