eb24e6ffc6
Adds an example with [`graphql-react`](https://github.com/jaydenseric/graphql-react), using [`next-graphql-react`](https://github.com/jaydenseric/next-graphql-react). [`graphql-react`](https://github.com/jaydenseric/graphql-react) is a lightweight but powerful [GraphQL](https://graphql.org) client for React; the first [Relay](https://facebook.github.io/relay) and [Apollo](https://apollographql.com/docs/react) alternative with server side rendering.
31 lines
588 B
JavaScript
31 lines
588 B
JavaScript
import { Query } from 'graphql-react'
|
|
|
|
export default () => (
|
|
<Query
|
|
loadOnMount
|
|
loadOnReset
|
|
fetchOptionsOverride={options => {
|
|
options.url = 'https://graphql-pokemon.now.sh'
|
|
}}
|
|
operation={{
|
|
query: /* GraphQL */ `
|
|
{
|
|
pokemon(name: "Pikachu") {
|
|
name
|
|
image
|
|
}
|
|
}
|
|
`
|
|
}}
|
|
>
|
|
{({ data, loading }) =>
|
|
data ? (
|
|
<img src={data.pokemon.image} alt={data.pokemon.name} />
|
|
) : loading ? (
|
|
<p>Loading…</p>
|
|
) : (
|
|
<p>Error!</p>
|
|
)
|
|
}
|
|
</Query>
|
|
)
|