Graphql react-apollo内省片段匹配器

Question

我正在使用GitHub Graphql API，并使用react-apollo编写了以下代码，但是当我在许多请求后分页时，控制台上出现以下错误。

您正在使用简单的（启发式）片段匹配器，但是您的查询包含联合或接口类型。 Apollo Client将无法准确映射片段。 要消除此错误，请按照docs中所述使用IntrospectionFragmentMatcher ： https : //www.apollographql.com/docs/react/recipes/fragment-matching.html

。

警告：启发式片段匹配正在进行中！

。

{“ __typename”：“ Organization”}中缺少字段名称

{“ __typename”：“ Organization”}中缺少字段avatarUrl

{“ __typename”：“ Organization”}中缺少字段存储库

我写了以下代码：

gql`
  query($username: String!, $nextPage: String) {
    search(query: $username, type: USER, first: 100, after: $nextPage) {
      pageInfo {
        hasNextPage
        endCursor
      }
      edges {
        node {
          ... on User {
            name
            avatarUrl
            repositories {
              totalCount
            }
          }
        }
      }
    }
  }
`;


handleSubmit = ({ username }) => {
    const { client } = this.props;
    this.setState({
      loading: true,
      searchTerm: username,
    });
    client
      .query({
        query: SEARCH_USER,
        variables: {
          username
        }
      })
      .then(({ data }) => {
        this.setState({
          loading: false,
          searchList: data.search.edges,
          pagination: data.search.pageInfo,
        });
      })
      .catch(err => {
        console.warn(err);
      });
  };

Answer 1

由于Apollo没有足够的有关GraphQL模式的信息，因此需要以某种方式提供它。 阿波罗（Apollo）有关于该主题的书面文档 。

它描述了使用脚本对您的GraphQL Server进行内部检查，以获取有关联合和接口的缺失信息。

为了使过程更加轻松，我为GraphQL代码生成器编写了一个插件，该插件可以自动执行所有操作。 我建议阅读一章“片段匹配器” 。

首先，手动解决方案或第二个应该解决您的问题:)