Apollo Client 3-全局事件侦听器？

Apollo Client 3中的全局事件侦听器是一种机制，允许开发者监听GraphQL查询和变更的生命周期事件。这些事件包括查询的开始、结束、成功和失败等。通过全局事件侦听器，开发者可以在这些关键点执行自定义逻辑，例如记录日志、显示加载状态或错误信息等。

基础概念

Apollo Client是一个强大的GraphQL客户端，它简化了与GraphQL API的交互。全局事件侦听器是Apollo Client 3中引入的一个新特性，它提供了一种统一的方式来监听和处理所有查询和变更的事件。

类型

Apollo Client 3中的全局事件侦听器主要包括以下几种类型：

查询开始（Query Start）：当查询开始执行时触发。
查询结束（Query End）：当查询成功完成或失败时触发。
变更开始（Mutation Start）：当变更开始执行时触发。
变更结束（Mutation End）：当变更成功完成或失败时触发。

应用场景

加载状态管理：在查询开始时显示加载指示器，在查询结束时隐藏它。
错误处理：在查询或变更失败时显示错误信息。
日志记录：记录查询和变更的执行情况，便于调试和分析。

示例代码

以下是一个使用Apollo Client 3全局事件侦听器的示例代码：

import { ApolloClient, InMemoryCache, gql } from '@apollo/client';

const client = new ApolloClient({
  uri: 'https://api.example.com/graphql',
  cache: new InMemoryCache(),
});

client.onResetStore(() => {
  console.log('Apollo Client store has been reset');
});

client.onQueryStart(({ query, variables }) => {
  console.log('Query started', { query, variables });
});

client.onQueryEnd(({ query, variables, data, loading, networkStatus }) => {
  console.log('Query ended', { query, variables, data, loading, networkStatus });
});

client.onMutationStart(({ mutation, variables }) => {
  console.log('Mutation started', { mutation, variables });
});

client.onMutationEnd(({ mutation, variables, data, loading, networkStatus }) => {
  console.log('Mutation ended', { mutation, variables, data, loading, networkStatus });
});

const GET_USER = gql`
  query GetUser($id: ID!) {
    user(id: $id) {
      name
      email
    }
  }
`;

client.query({ query: GET_USER, variables: { id: 1 } }).then(result => {
  console.log(result.data);
});