“Como usar a API grafql no React” Respostas de código

Como usar a API grafql no React

import React from "react";
import { request, gql } from "graphql-request";
import { useQuery } from "react-query";

const endpoint = "https://api.spacex.land/graphql/";
const FILMS_QUERY = gql`
  {
    launchesPast(limit: 10) {
      id
      mission_name
    }
  }
`;

export default function App() {
  const { data, isLoading, error } = useQuery("launches", () => {
    return request(endpoint, FILMS_QUERY);
  });

  if (isLoading) return "Loading...";
  if (error) return <pre>{error.message}</pre>;

  return (
    <div>
      <h1>SpaceX Launches</h1>
      <ul>
        {data.launchesPast.map((launch) => (
          <li key={launch.id}>{launch.mission_name}</li>
        ))}
      </ul>
    </div>
  );
}
Sanvi Rahman

Reactar a integração JS e GraphQL

1
2
3
npx create-react-app my-graphql-react-project
cd my-graphql-react-project
yarn add @apollo/client graphql
Frantic Frog

Respostas semelhantes a “Como usar a API grafql no React”

Perguntas semelhantes a “Como usar a API grafql no React”

Mais respostas relacionadas para “Como usar a API grafql no React” em JavaScript

Procure respostas de código populares por idioma

Procurar outros idiomas de código