Apollo GraphQL请求被取消 [英] Apollo GraphQL requests are canceled

问题描述

我正在使用 Downshift 和 react-apollo 构建一个React类型的前置文本字段组件.在用户输入时，我正在查询输入建议，并将其显示在文本字段下方.

I am building a React type ahead text field component using Downshift and react-apollo. As the user types I am querying type ahead suggestions and present them underneath the text field.

不幸的是，这种体验并不顺利.由于某些原因，阿波罗有时会取消50％以上的请求.

Unfortunately, this experience is not going smoothly. For some reason every now and then Apollo cancels more than 50 percent of the requests.

我还记录了响应数据，该数据可由 graphql HoC包装的组件可以访问.在需要的情况下，正在加载状态设置为 false ，并且我的 words 数据可用.在不希望的情况下，正在加载状态设置为 true ，并且没有 words 数据可用.无论是需要还是不希望的请求，后端都会每次执行.

I am also logging the response data that is accessible to the component wrapped with the graphql HoC. In the desired case, the loading state is set to false and my words data are available. In the undesired case, loading state is set to true and no words data are available. Whether desired or undesired request, the backend executes every time.

请注意 1 的networkStatus.

Please note the networkStatus of 1.

请注意 7 的networkStatus.

Please note the networkStatus of 7.

为什么阿波罗取消了这些请求?该如何解决?

Why is apollo cancelling these requests? How to fix this?

推荐答案

您如何使用graphql高阶组件?

How are you using the graphql higher order component?

似乎您在render函数本身中创建了该高阶组件的实例.渲染会被触发很多次，特别是如果您使用.如果在解决请求之前发生了重新渲染，则旧的请求将被取消.您可以通过使用新的查询组件来避免这种情况.查询组件可以在渲染中轻松使用.它使那些重新渲染的文件变得优雅.

It seems you create an instance of that higher order component in the render function itself. render is triggered many times especially if you use . If a re-render occurs before the request has been resolved the old request is being canceled. You can avoid this by using the new Query component instead. The Query component can easily be used within render. It handels those re-renders gracefully.

这篇关于Apollo GraphQL请求被取消的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！