响应后如何在 Apollo GraphQl 中重新定义查询的形状答案

【问题标题】：How to redefine shape of query in Apollo GraphQl after a response响应后如何在 Apollo GraphQl 中重新定义查询的形状
【发布时间】：2023-04-07 23:42:02
【问题描述】：

使用 apollo 很棒，但是如何更改查询响应的形状。我正在使用 reactjs 来显示用户详细信息和他们的音乐信息

说我有一个问题

query {
 userDetails {
  id,
  name,
  music {
   name,
   type
  }
}

有没有办法使用 apollo（不在 reactjs 中）将形状更改为类似

query {
 userDetails {
  id,
  name,
  musicName,
  musicType
 }
}

这样我得到第二个形状作为响应而不是第一个，然后我将不得不使用 reactjs 更改它

【问题讨论】：

我不认为这是可以实现的。 GraphQL 定义了实体，它的职责是在请求时返回该实体。将实体转换为所需形状的责任应该是使用它的组件/服务。
哦，好吧意味着我只需要继续做我一直在做的事情

标签： apollo apollo-client react-apollo

【解决方案1】：

您可以使用 @client-directive 和 TypePolicies 创建从获取的字段中读取的 local-only 字段

假设查询返回的类型名是“用户”：

查询：

query {
 userDetails {
  id,
  name,
  music {
   name,
   type
  }
  musicName@client
  musicType@client
}

客户端设置：

const client = new ApolloClient({
  cache: new InMemoryCache({
    typePolicies: {
      User: {
        fields: {
          musicName: {
            read(_, { readField }) {
              return readField('music').name;
            }
          },
          musicType: {
            read(_, { readField }) {
              return readField('music').type;
            }
          },
        }
      }
    }
  }),
  uri: "yourGraphqlServer.com"
});

【讨论】：

实际上是在寻找这种类型的东西