Как использовать мутации ответа-запроса с аксиомами?

Question

Я пытаюсь использовать мутации ответа -запроса с помощью аксиомов, но когда мой запрос возвращает ошибку http, мойcatch() не называется.

Вот что я пробовал:

const BannerRightConfirmEmail = () => {
  const [{ token }] = useState<ITokenConfirmationEmailParam>(useParams());
  const [mutateConfirmEmail] = useMutation(confirmEmailUser);

  useEffect(() => {
    confirmEmail();
  }, []);

  const confirmEmail = async () => {
    try {
      await mutateConfirmEmail(token);
    } catch (errorReq) {
      console.log(errorReq);
    }
  };

мой user.service.ts:

const confirmEmailUser = async (token: string) => {
  await api.patch('/users/confirmEmail/' + token)
}

export { confirmEmailUser }

мой api.ts:

const api = axios.create({
  baseURL: "http://localhost:3100",
});

Мой запрос возвращает статус ошибки 400, но в моем catch(), Почему?

Answer 1

Функция mutate обрабатывает исключение, поэтому блок catch никогда не запускается. Вы можете обрабатывать ошибки, используя onErrorфункция-обработчик, которая может быть установлена ​​на уровне функции перехвата или изменения. Например:

const [
   mutate,
   { status, isIdle, isLoading, isSuccess, isError, data, error, reset },
 ] = useMutation(mutationFn, {
   onError(err, variables, onMutateValue) {
      // error handling logic
      // fires after the mutate-level handler
   }
 })
const promise = mutate(variables, {
   onError(err, variables, onMutateValue) {
      // error handling logic
      // fires before the hook-level handler
   }
 })

В качестве альтернативы вы также можете переместить логику обработки ошибок внутри mutationFn перешел к useMutation как это:

const confirmEmailUser = async (token: string) => {
  let response;
  try {
    response = await api.patch('/users/confirmEmail/' + token)
  } catch (errorReq) {
    console.log(errorReq);
  }
  return response;
}

export { confirmEmailUser }

Таким образом вы сможете обработать ошибку до того, как она достигнет react-query