GOOGLE ADS

четверг, 28 апреля 2022 г.

Реагировать на setState внутри обратного вызова, не обновляя состояние

Я пытаюсь составить пару хуков вместе, чтобы получить желаемый результат, проблема в том, что обновление состояния из этих обратных вызовов (в частности, ошибка) не обновляет состояние

Крюк входа, который обрабатывает, если пользователь уже вошел в систему, и предоставляет функцию входа в систему.

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 },
);

Комментариев нет:

Отправить комментарий

Laravel Datatable addColumn returns ID of one record only

Я пытаюсь использовать Yajra Datatable для интеграции DataTable на свой веб-сайт. Я смог отобразить таблицу, но столкнулся с проблемой. В по...