kitten.sh
1<script>
2 import { getContextClient, gql, queryStore } from "@urql/svelte";
3
4 let skip = 0;
5 $: pokemons = queryStore({
6 client: getContextClient(),
7 query: gql`
8 query ($skip: Int!) {
9 pokemons(limit: 10, skip: $skip) {
10 id
11 name
12 }
13 }
14 `,
15 variables: { skip },
16 requestPolicy: 'cache-and-network'
17 });
18
19 function nextPage() {
20 skip = skip + 10;
21 }
22
23 function reexcute() {
24 pokemons.reexecute({ requestPolicy: 'network-only' })
25 }
26</script>
27
28<div>
29 {#if $pokemons.fetching}
30 Loading...
31 {:else if $pokemons.error}
32 Oh no... {$pokemons.error.message}
33 {:else}
34 <ul>
35 {#each $pokemons.data.pokemons as pokemon}
36 <li>{pokemon.name}</li>
37 {/each}
38 </ul>
39 {/if}
40 <button on:click={nextPage}>Next Page</button>
41 <button on:click={reexcute}>Reexec</button>
42</div>