Блог

У меня есть функция мутации , которая делает запрос POST и получает id , после чего мне нужно немедленно вызвать функцию следующей мутации, чтобы совершить покупку в соответствии с этим id , как мне это сделать ?

 const mutation = useCreatePaymentMethodMutation();

const handleSubmit = async(values:any) {
  const form = await mutation.mutateAsync({
    values,
    hash
  })
  return form
}
 

useCreatePaymentMethodMutation импортируется из @Hooks

 const useCreatePaymentMethodMutation = () => {
 return useMutation(
    ({ values, accessHash }: { values: any; accessHash: string }) =>
      createPaymentMethodRequest(values, accessHash),
    {
      onSuccess: (data) => {
        // usePayMutation(data.data, accessHash); error. I need to use data after 1st mutation in next 
        request
        console.log("on success data ", data);
      },
    }
  );
}
 

UPD 1

Вот мой usePayMutation метод

 const usePayMutation = () => {
  return useMutation(({ data, id }: { data: any; id: string }) =>
    payRequest(data, id)
  );
};
 

У вас есть 2 варианта сделать это

Вариант 1: В ваших useCreatePaymentMethodMutation крючках

 const useCreatePaymentMethodMutation = () => {
 const mutatePay = usePayMutation()
 return useMutation(
    ({ values, accessHash }: { values: any; accessHash: string }) =>
      createPaymentMethodRequest(values, accessHash),
    {
      onSuccess: (data) => {
        mutatePay(data.id)
      },
    }
  );
}

 

Вариант 2:
В вашей handleSubmit функции

 const mutatePay = usePayMutation()

const handleSubmit = (values:any) => {
  return mutation.mutateAsync({
    values,
    hash
  }).then(data=> mutatePay(data.id))
}
 

вы бы создали две разные мутации и назвали их одну за другой:

 const createPayment = useCreatePaymentMethodMutation()
const otherMutation = useOtherMutation()

const handleSubmit = async(values:any) {
  try {
    const form = await createPayment.mutateAsync({
      values,
      hash
    })
    await otherMutation.mutateAsync(form.id)
  }
  catch(...)
}