CODEWITHSUNDEEP
javascriptreactjsgraphqlapolloreact-apollo
Batman
Batman

Reputation: 6353

useEffect not triggered after useMutation using Apollo Client

I have a parent component which has:

  const { loading, error, data } = useQuery(GET_DATA, {
    notifyOnNetworkStatusChange: true
  });

  // Handle data
  useEffect(() => {
    if (loading || error) return;
    setZendeskData(data);
  }, [loading, error, data]);

Then in a child component I have: 

  const [createItem] = useMutation(CREATE_SESSION, {
    refetchQueries: [{ query: GET_DATA }]
  });

When the createItem is called and the refetchQuery runs, the useEffect in the parent component does not update the data.

What would be the best way to make sure data is always the latest?

Upvotes: 2

Views: 1354

Answers (1)

zero298
zero298

Reputation: 26867

Take a look at notifyOnNetworkStatusChange from the docs:

Let's return to our refetching example from the previous section. If you click the refetch button, you'll see that the component doesn't re-render until the new data arrives. What if we want to indicate to the user that we're refetching the photo?

I think it pertains to your exact use case. You would then add networkStatus from the useQuery as a useEffect dependency.

Upvotes: 3

Related Questions