当axios ajax调用失败时如何访问状态码
当axios ajax调用失败时如何访问状态码
提问于 2018-09-28 00:05:56
在我们的项目中，我们使用Axios中间件来进行Ajax调用，并且为了拥有一致的Action类型，我们使用FSA(Flux Standard Action)作为数据结构。例如，我们的操作和Reducer如下所示
//Action
import { createAction } from "typesafe-actions";
export const GET_USER = "GET_USER";
// GET_USER_SUCCESS and GET_USER_FAILURE are automatically triggered from the axios
middleware
export const userActions = {
getUser: createAction(GET_USER, () => ({
type: GET_USER,
payload: {
request: {
url: "/username",
},
},
})),
getUserSuccess: createAction("GET_USER_SUCCESS", (data: string) => ({
type: "GET_USER_SUCCESS",
payload: {
data: data // put returned data type here name: "nothing",},
},
})),
getUserFailure: createAction("GET_USER_FAILURE"),
};
//Redux
import { RootAction } from "../actions/RootAction";
import { userActions } from "../actions/UserActions";
import { getType } from "typesafe-actions";
export const userReducer = (state = INITIAL_STATE, action: RootAction): UserState =>
{
switch (action.type) {
case getType(userActions.getUserSuccess): {
return {
...state,
username: action.payload.data,
};
}
default:
return state;
}
};现在，在呼叫失败的情况下，我可以从下面访问状态代码
在如何访问动作或减速器或应用程序中任何位置的状态代码方面需要帮助。
回答 1
Stack Overflow用户
发布于 2018-09-28 08:24:08
您可以在操作文件中创建错误处理函数，并使用它来调度包含错误详细信息的操作。然后，只需将此函数放入每个catch语句中，就可以在应用程序中的任何位置访问错误。示例实现如下所示(redux thunk方法)：
获取数据
export function fetchData() {
return async (dispatch) => {
try {
const { data: payload } = await axios.get('https://jsonplaceholder.typicode.com/psosts');
dispatch({
type: FETCH_DATA,
payload
})
} catch (error) { throwError(error, dispatch) }
}
}处理错误
function throwError(error, dispatch) {
const { status, statusText } = error.response;
dispatch({
type: THROW_ERROR,
payload: { status, content: statusText }
})
}而reducer就像任何其他的reducer一样;)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52541044
复制相关文章
相似问题
腾讯云开发者
