如何了解 ApolloClient 中全局所有查询的网络状态？

Question

我试图在网络状态正在进行时显示预加载器。

我知道每个查询都会返回自己的网络状态，但在我的应用程序中有很多不同的查询。我希望有一种方法可以在全球范围内处理所有查询的所有网络状态。

我想在代码中了解以下问题的答案：“网络上是否有任何待处理的查询？”。

Answer 1

目前，还没有办法做到这一点，至少不容易/内置。您可以在https://github.com/apollographql/apollo-feature-requests上请求此功能。

根据您想要实现的目标，使用中间件/后件HttpLink就足够了，例如：

import { ApolloLink } from 'apollo-link';

const middleware = new ApolloLink((operation, forward) => {
  console.log('Starting', operation);

  return forward(operation);
});

const afterware = new ApolloLink((operation, forward) => {
  return forward(operation).map(response => {
    console.log('Completed', operation);

    return response;
  });
});

const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: ApolloLink.from([
    middleware,
    afterware,
    new HttpLink({ ... }),
  ]),
});

会middleware在每个请求之前调用， ,afterware之后调用。您可以在以下位置阅读有关链接的更多信息： https: //www.apollographql.com/docs/link/。

或者，查看 Apollo 公开公开的一些 API，我能够通过这种“非官方”方式进行检查：

function queriesInFlight() {
  // client is your ApolloClient instance
  const { queryManager } = client;

  return Object.keys(queryManager.queryStore.getStore()).filter(queryId =>
    queryManager.checkInFlight(queryId),
  );
}