Я пытаюсь составить пару хуков вместе, чтобы получить желаемый результат, проблема в том, что обновление состояния из этих обратных вызовов (в частности, ошибка) не обновляет состояние
Крюк входа, который обрабатывает, если пользователь уже вошел в систему, и предоставляет функцию входа в систему.
export const useLogin = (checkForSession: boolean) => {
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState<string | undefined>(undefined);
const onSucessLogin = (data: any) => {
setIsLoading(false);
};
const onLoginError = (err: any) => {
console.debug("Login error is", err);
setError("error"); // THIS DOESN'T WORK, the error is always undefined
};
const loginMutation = useServerLoginMutation(
(res) => {
onSucessLogin(res);
},
(err) => { onLoginError(err },
);
const login = async (email: string, password: string) => {
setIsLoading(true);
try {
//firebase authentication goes first, then my server
loginMutation.mutate({ uid, token });
} catch (err) {
setError("error occured");
}
};
return {
isLoading,
data,
error,
login,
};
};
Другие файлы, если они необходимы
И мой useServerLoginMutation.ts
файл
export const useServerLoginMutation = (
isMounted: boolean,
onSucess: (res: any) => void,
onError: (error: any) => void,
) => {
return useMutation(GetLogin, {
onSuccess: (res) => {
onSucess(res);
},
onError: (err) => {
onError(err);
},
});
};
И мой getLogin.ts
с GetLogin
функцией
export const GetLogin = async (params: {
uid: string;
token: string;
}): Promise<any> => {
const res = await axios.get<any>(
...
);
return res.data;
};
Так что это происходит в нескольких местах, когда у меня есть эти вложенные хуки, и я пытаюсь обновить состояние из обратного вызова, состояние не обновляется. Не уверен, почему, какой-нибудь волшебник React должен мне помочь
Решение проблемы
ваш useServerLoginMutation
хук принимает 3 параметра, и вы вызываете его с 2:
export const useServerLoginMutation = (
isMounted: boolean,
onSucess: (res: any) => void,
onError: (error: any) => void,
) => {
return useMutation(GetLogin, {
onSuccess: (res) => {
onSucess(res);
},
onError: (err) => {
onError(err);
},
});
};
// here how you call it where isMounted should be the first param.
const loginMutation = useServerLoginMutation(
(res) => {
onSucessLogin(res);
},
(err) => { onLoginError(err },
);
Комментариев нет:
Отправить комментарий