如何重新获取直到从服务器返回特定值？（反应-阿波罗）

Question

使用 React-Apollo，是否可以再次重新获取，直到获取的数据具有特定值？

假设我有一个组件会一直 ping 服务器，直到服务器返回某个响应。

graphql(gql`
  query {
    ping {
      response
    }
  }
`)(MyComponent)

服务器要么返回

ping: {
  response: "busy"
}

或者

ping: {
  response: "OK"
}

我希望这个组件每隔一秒就 ping 服务器（轮询），直到响应“正常”。使用 Apollo 最简单的方法是什么？

Answer 1

基本上你需要做的就是设置一个带有选项的查询，pollInterval当你得到想要的响应时，调用stopPolling到达函数data中的props函数。并确保fetchPolicy设置为'network-only'与轮询兼容。

阅读关于options.pollInterval这里，大约options.fetchPolicy这里和有关数据的结构支撑位置。

此代码应该适合您：

const PingQuery = gql`
  query {
    ping {
      response
    }
  }
`

graphql(PingQuery, {
    options: {
        fetchPolicy: 'network-only', // we don't want to get the response from the cache
        pollInterval: 1000 // in milliseconds,      
    },
    props: ({data: {loading, ping, stopPolling}) => {
        if (loading) {
            return // still loading, ping is undefined
        }
        if (ping.response === 'busy') {
            // still busy
            return
        }       
        // not busy.. stop polling and do something
        stopPolling()
    }
})(MyComponent)