TanStackT
TanStack•3y ago•
8 replies
rubber-blue

`isRefetching` is always true

In SvelteKit I'm trying to set up a traditional paginated table and disable the pagination controls while loading a new page. I'm doing something like the following:

<script lang="ts">
  export let data: PageData

  let limit = 5
  let offset = 0

  $: query = createQuery({
    queryKey: ['query', limit, offset],
    queryFn: async () => await trpc($page).example.query({limit, offset}),
    initialData: data.example,
    keepPreviousData: true
  })
</script>

<Table data={$query.data} />
{#if $query.isRefetching}
  <LoadingSpinner />
{:else}
  <PaginationControls {limit} {offset} total={data.total}/>
{/if}


Without the if $query.isRefetching everything works fine but once I add this check the loading spinner is always shown. When I first load the page the pagination controls show for a split second but then the loading spinner comes back. Am I misunderstanding how isRefetching works?
Was this page helpful?