从 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() 钩子，但我被特别要求使用 Class 组件

Answer 1

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

从 React 中的 GraphQL 查询获取数据

Get the data from GraphQL query in React

javascript

asynchronous

reactjs

graphql