从 React 中的 GraphQL 查询中获取数据

Question

如果这是显而易见的事情，我很抱歉，我只是不明白。 我正在尝试从 GraphQL 服务器获取数据。我正在关注 Apollo 客户端上的文档，一切都很好。问题是我一直以承诺的形式获取数据，而不是真实的对象

const GET_DATA = gql`
  {
    category {
      name
      products {
        name
        inStock
      }
    }
  }
`;
const data = client
  .query({
    query: GET_DATA,
  })
  .then((result) => {
    return result;
  })
  .then((res) => res.data);
ReactDOM.render(
  <ApolloProvider client={client}>
    <React.StrictMode>
      <App data={data} />
    </React.StrictMode>
  </ApolloProvider>,
  document.getElementById("root")
);

我尝试链接另一个 .then() 方法并使用 .json() 方法转换响应，但没有成功。可能是因为 GraphQL 响应不同？

我会使用 useQuery() 钩子，但我被特别要求使用类组件

Answer 1

data const 变量将持有一个承诺，但您从 GraphQl 获得的结果应该是正确的，在第一个 .then 块中，您需要将结果保存在一个状态中，然后将该状态作为数据返回到你的应用组件。