Question

在我的react项目中，我使用查询来搜索github用户数据。查询如下：

const GET_USER = (user) => `
{
  user(login: "${user}") {
    name
    login
    avatarUrl
    company
    gists{
     totalCount
   }
   following{
      totalCount
    }
    followers(last: 5){
      edges{
            node{
                id
            name
            avatarUrl
        }
      }
    }
    repositories(last: 5){
      edges{
        node{
          id
          name
        }
      }
    }
  }
}
`;

如果我仅通过在email中添加一个名为followers的字段来更新查询，则React应用将停止工作：


followers(last: 5){
      edges{
            node{
            id
            name
            avatarUrl
            email
        }
      }
    }

如果我在查询中添加有关组织的数据，也会发生相同的情况，

 organizations(last: 5){
      edges{
        node{
          id
          name
        }
      }
    }

但是当我在此链接中执行相同的查询时：[https://developer.github.com/v4/explorer/]，它可以工作。

我的react项目在链接中：[https://github.com/rvmelo/react-tech6-final-project]。该查询位于App.js文件夹内的src文件中。

Answer 1

它停止工作，因为用户可能没有这些信息。

我克隆了您的仓库并添加了代码

<div>email:{user.following.email}</div>

它确实停止工作，然后我添加了一个后备广告

<div>email:{user.following.email || ""}</div>

它奏效了。

您可能想在渲染之前检查这些信息，例如

{user && user.following && user.following.email &&
  (<div>email:{user.following.email}</div>)
}

与organizations

相同

<p>
  {user && user.organizations &&
    <div>Organization name:{user.organizations.name}</div>
  }
</p>

关于followers（已更新）

const Followers = ({ followers }) => (
<div>

  <strong>Followers updated for SO:</strong>

  <ul>
    {followers.edges.map(follower => (
    <li key={follower.node.id}>
      <img src={follower.node.avatarUrl}/>
      <div>
        {follower && follower.node && follower.node.name && (
        <div>Name:{follower.node.name}</div>) }
      </div>
      <div>
        {follower && follower.node && follower.node.email && (
        <div>Email:{follower.node.email}</div>) }
      </div>
    </li>
    ))}
  </ul>
</div>
);

我的个人资料的屏幕截图。一个跟随者有电子邮件，另一个没有。

我继续并分叉了您的仓库，here's my repo是从您问题的one中克隆出来的确保您的令牌具有权限。在此刻的紧张时刻，我完全可以使用我的钥匙。检查你的！

为什么graphql查询在反应中不起作用？

1 个答案: