1import React from 'react';
2import { useLazyQuery } from '@apollo/client';
3
4function DelayedQuery() {
5 const [getDog, { loading, data }] = useLazyQuery(GET_DOG_PHOTO);
6
7 if (loading) return <p>Loading ...</p>;
8
9 return (
10 <div>
11 {data && data.dog && <img src={data.dog.displayImage} />}
12 <button onClick={() => getDog({ variables: { breed: 'bulldog' } })}>
13 Click me!
14 </button>
15 </div>
16 );
17}