Mutation -> Invalidation + Refetch or setQueryData

Currently in our app, we have a lot of scenarios where we do the following:

  const mutation = useMutation(
    (params) => {
      return fetchFunction({
        params
      });
    },
    {
      retry: 1,
      onSuccess: async () => {
        await queryClient.invalidateQueries(
          [QUERY_KEYS],
          {
            refetchType: 'all',
          }
        );
        refetch();
      },

  const mutation = useMutation(
    (params) => {
      return fetchFunction({
        params
      });
    },
    {
      retry: 1,
      onSuccess: async () => {
        await queryClient.invalidateQueries(
          [QUERY_KEYS],
          {
            refetchType: 'all',
          }
        );
        refetch();
      },

Having read around I am feeling that we could instead use

setQueryData

setQueryData

here in the

onSuccess

onSuccess

of the

useMutation

useMutation

?

What are the pros / cons of this, is there a recommended best practice where we update some data via a mutation and need our results immediately. (The queries would be 'active' but don't seem to fetch data until refocus / navigation after invalidation without the refetch call).

Thanks!

TanStack•3y ago•

8 replies

dangerous-fuchsia

Mutation -> Invalidation + Refetch or setQueryData

Currently in our app, we have a lot of scenarios where we do the following:

  const mutation = useMutation(
    (params) => {
      return fetchFunction({
        params
      });
    },
    {
      retry: 1,
      onSuccess: async () => {
        await queryClient.invalidateQueries(
          [QUERY_KEYS],
          {
            refetchType: 'all',
          }
        );
        refetch();
      },

  const mutation = useMutation(
    (params) => {
      return fetchFunction({
        params
      });
    },
    {
      retry: 1,
      onSuccess: async () => {
        await queryClient.invalidateQueries(
          [QUERY_KEYS],
          {
            refetchType: 'all',
          }
        );
        refetch();
      },

Having read around I am feeling that we could instead use

setQueryData

setQueryData

here in the

onSuccess

onSuccess

of the

useMutation

useMutation

Mutation -> Invalidation + Refetch or setQueryData

Similar Threads

Mutation -> Invalidation + Refetch or setQueryData

Similar Threads

Similar Threads

Similar Threads