question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

loading status not working in fetchMore

See original GitHub issue

When i call fetchMore i can see

const {loading} =  useQuery() 
console.log(loading)

true - first call
false - fetchMore
false - fetchMore
false - fetchMore
false - fetchMore

BUG: Missing true state

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

12reactions
liumin1128commented, Jun 10, 2019
import { useState } from 'react';
import { useQuery as _useQuery } from 'react-apollo-hooks';

export function useLoadMore(fetchMore, data, variables) {
  const [ isLoadingMore, setIsLoadingMore ] = useState(false);

  function loadMore() {
    setIsLoadingMore(true);
    fetchMore({
      variables: {
        ...variables,
        skip: data.list.length,
      },
      updateQuery: (previousResult, { fetchMoreResult }) => {
        setIsLoadingMore(false);
        if (!fetchMoreResult) {
          return previousResult;
        }
        return {
          ...fetchMoreResult,
          list: [
            ...previousResult.list,
            ...fetchMoreResult.list,
          ],
        };
      },
    });
  }

  return [ isLoadingMore, loadMore ];
}

export function useQuery(schema, variables, options) {
  const { fetchMore, data, ...other } = _useQuery(schema, { variables, ...options });
  const [ isLoadingMore, loadMore ] = useLoadMore(fetchMore, data, variables);

  return { isLoadingMore, loadMore, fetchMore, data, ...other };
}

2reactions
polRkcommented, Jun 22, 2019

Yes! It’s work ‘notifyOnNetworkStatusChange: true’

Read more comments on GitHub >

github_iconTop Results From Across the Web

react apollo - Why would data.loading not become true during ...
I was having the same problem. Turns out you have to opt in by setting notifyOnNetworkStatusChange to true in your options:.
Read more >
Can't get infinite loading with fetchmore to work - Help
I am trying to make this work, but somewhere I am missing a key component. Within my client creation, I have added a...
Read more >
Infinite Scroll With Apollo Client 3 - Trevor Blades
A fetchMore query is not currently in progress · We know there are still additional pages of data to load · We haven't...
Read more >
Apollo pagination tutorial: using fetchMore() - Emma Goto
const { data, loading, error, refetch, fetchMore } = useQuery(QUERY, ... If we modify the fetchMoreResult , we can get around this problem....
Read more >
GraphQL Pagination with Apollo Client in React - Educative.io
Not Specified. ... Since the button to fetch more repositories fits best in the ... So far, the loading boolean in the Query...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found