#react-native #redux #axios #redux-thunk
Вопрос:
ApiCall.js
Здесь я вызвал свой API с помощью Axios. Я использовал Обещание, чтобы получить ответ. Этот ответ решается позже, и действие redux вызывает случай сбоя до получения этого ответа.
export const callPostApi = async (url, body) => {
console.log('url ==> ', url, ' body ===> ', body);
return new Promise((resolve, reject) => {
try {
axios.post(url, body, config).then(
(response) => {
console.log('response ==> ', response.data);
const { success, data, message } = response.data;
if (!success) {
alert(message);
}
return resolve(response.data);
},
(error) => {
console.log('error in post api', error);
return reject(error);
}
);
} catch (error) {
console.log('error', error);
}
});
};
export const callLoginApi = async (body) => {
const resp = await callPostApi(apis.LOGIN_URL, body);
return resp;
};
ActionCreator.js
export const loginLoading = () => {
return { type: types.LOGIN_LOADING };
};
export const loginSuccess = (data) => {
return {
type: types.LOGIN_SUCCESS,
payload: data,
};
};
export const loginError = (error) => {
return { type: types.LOGIN_ERROR, error };
};
action.js
Я ставлю здесь асинхронное ожидание. Но redux не ждет ответа. Здесь я получаю ответ неопределенный после того, как ответ на вызов API получен как успешный. какую ошибку я совершаю?
export const login = (body) => async (dispatch) => {
dispatch(ActionCreator.loginLoading());
try {
const resp = await callLoginApi(body);
console.log('login resp ==> ', resp);
if (resp != undefined amp;amp; resp != null) {
const { success = false, message = '', data } = resp;
if (success == true) {
const obj = { user: data.user, token: data.token, isLoggedIn: true };
dispatch(ActionCreator.loginSuccess(obj));
storeJSON(CONST.user, data.user);
storeString(CONST.token, data.token);
RootNavigation.navigate(SCREENS.Tab, { screen: SCREENS.Home });
} else {
dispatch(ActionCreator.loginError(message));
}
if (message != '') {
alert(message);
}
}
} catch (error) {
dispatch(ActionCreator.loginError(error));
}
};
Комментарии:
1. Для выполнения асинхронных действий используйте промежуточное программное обеспечение thunk github.com/reduxjs/redux-thunk
2. @MichaelBahl Я уже использую redux-thunk
3. Поскольку callPostApi является асинхронным, необходимо ли возвращать обещание? Попробуйте удалить асинхронность перед вызовом postapi.