reactjstypescriptreact-query

How to return data from Tanstack React Query useMutation?


I have a form, and I want to return the id from the newly created object which I'm creating through Axios via a REST API.

I'm integrating Tanstack Query, using the useMutation hook. I've created my own hook so I can use the mutation code throughout my react application.

const useCreateUser = () => {
  const queryClient = useQueryClient();

  return useMutation({
    mutationFn: ({ user, accessToken }: createUserInputs) =>
      createUser(user, accessToken),
    onSuccess: (data) => {
      console.log(data)
    },
  });
};

Console.log(data) is working.

I'm declaring the hook like this:

const { data:createduser, mutate: createUser } = useCreateUser();

and calling the hook like this:

await createUser({ user: user, accessToken: accessToken });

but this is not returning the data.

Where am I going wrong!


Solution

  • You should get returning data from data useMutations props:

    const { data:createduser, mutate: createUser, isSuccess } = useCreateUser();
    
    createUser({ user: user, accessToken: accessToken });
    if (isSuccess) {
        console.log(createduser); // data here!
    }