wispy-olive

Multiple Unique Mutation Calls With Different Mutation Keys

I have to perform post API calls to send data multiple times. The data is from local storage so it's in a form of an array. I will loop trough it and perform mutation. Here's the hook:

export default function useSendStory({
  idStory,
  idChapter,
}: {
  idStory: number | undefined;
  idChapter: number | undefined;
}) {
  return useMutation({
    mutationKey: queryKeys.sendStory({idStory, idChapter}),

    mutationFn: uploadStory,

    onSuccess: data => {
      console.log(data);
    },
  });
}

export default function useSendStory({
  idStory,
  idChapter,
}: {
  idStory: number | undefined;
  idChapter: number | undefined;
}) {
  return useMutation({
    mutationKey: queryKeys.sendStory({idStory, idChapter}),

    mutationFn: uploadStory,

    onSuccess: data => {
      console.log(data);
    },
  });
}

With the current approach, every time I perform the call, I have to recreate the hook since it's gonna have unique

idStory

idStory

and

idChapter

idChapter

.

How can I pass its unique data such as

idStory

idStory

and

idChapter

idChapter

to the useMutation hook without recreating the hook? is it normal to recreate the hook for each mutation call? Or I don't need to provide mutation keys? Will it overwrite the existing fetch?

TanStack•2y ago

wispy-olive

Multiple Unique Mutation Calls With Different Mutation Keys

I have to perform post API calls to send data multiple times. The data is from local storage so it's in a form of an array. I will loop trough it and perform mutation. Here's the hook:

export default function useSendStory({
  idStory,
  idChapter,
}: {
  idStory: number | undefined;
  idChapter: number | undefined;
}) {
  return useMutation({
    mutationKey: queryKeys.sendStory({idStory, idChapter}),

    mutationFn: uploadStory,

    onSuccess: data => {
      console.log(data);
    },
  });
}

export default function useSendStory({
  idStory,
  idChapter,
}: {
  idStory: number | undefined;
  idChapter: number | undefined;
}) {
  return useMutation({
    mutationKey: queryKeys.sendStory({idStory, idChapter}),

    mutationFn: uploadStory,

    onSuccess: data => {
      console.log(data);
    },
  });
}

With the current approach, every time I perform the call, I have to recreate the hook since it's gonna have unique

idStory

idStory

and

idChapter

idChapter

.

How can I pass its unique data such as

idStory

idStory

and

idChapter

idChapter

to the useMutation hook without recreating the hook? is it normal to recreate the hook for each mutation call? Or I don't need to provide mutation keys? Will it overwrite the existing fetch?

Multiple Unique Mutation Calls With Different Mutation Keys

Similar Threads

Multiple Unique Mutation Calls With Different Mutation Keys

Similar Threads

Similar Threads

Similar Threads