Question

我需要在React中每30秒轮询一次API以获取响应

我正在考虑调用此方法：

poll() {
    setTimeout(() => {
        console.log('polling') // would hit the API here
    }, 100)
}

在componentDidMount内，然后在其中进行三元操作或其他操作

但是在componentDidMount中，我不喜欢这样做

this.props.loading ? this.poll() : null

说了一些关于期望函数的东西，但是看到了表达（掉毛错误）

我如何轮询API或这是正确的方法？

Answer 1

我认为您应该通过以下方式检查 poll（）方法中的 props.loading ：

poll () {
    // you should keep track of the timeout scheduled and 
    // provide a cleanup if needed
    this.state.polling && clearTimeout(this.state.polling)

    if (!this.props.loading) {            
        this.setState({ polling: false })
        return
    }

    const polling = setTimeout(() => {
        // stuff here

        // as last step you should call poll() method again
        // if you have asyncronous code you should not call it
        // as a step of your async flow, as it has already is 
        // time period with setTimeout
        this.poll()
    }
    , this.state.pollingIntervall)

    this.setState({
        polling
    })
}

然后，您只需要调用 poll（）方法即可启动它。

添加了 state.pollingIntervall 只是为了配置轮询时间。

用React轮询API

1 个答案: