如何在另一个动作成功后调用redux动作?

j_d*_*j_d 6 functional-programming flux reactjs redux react-redux

所以我有一个auth相关的reducer设置如下:

export default function reducer(state = initialState, action = {}) {
  switch (action.type) {
    case LOAD:
      return {
        ...state,
        loading: true,
      }
    case LOAD_SUCCESS:
      return {
        ...state,
        loading: false,
        loaded: true,
        jwt: action.jwt,
      }
    case LOAD_FAIL:
      return {
        ...state,
        loading: false,
        loaded: false,
        error: true,
        errorMessage: action.error,
      }
    case LOGIN:
      return {
        ...state,
        loaded: false,
        loggingIn: true,
      }
    case LOGIN_SUCCESS:
      return {
        ...state,
        loaded: true,
        loggingIn: false,
        jwt: jwtDecode(action.result.token),
      }
    case LOGIN_FAIL:
      return {
        ...state,
        loggingIn: false,
        user: null,
        error: true,
        errorMessage: action.error,
      }
    case LOGOUT:
      return {
        ...state,
        loggingOut: true,
      }
    case LOGOUT_SUCCESS:
      return {
        ...state,
        loggingOut: false,
        user: null,
        jwt: null,
      }
    case LOGOUT_FAIL:
      return {
        ...state,
        loggingOut: false,
        error: true,
        errorMessage: action.error,
      }
    default:
      return state
  }
}
Run Code Online (Sandbox Code Playgroud)

其中LOAD是先前存储的(cookie或JWT)auth的加载,并且LOGIN/LOGOUT是不言自明的.

在成功加载或登录后,我需要触发一些进一步的操作.

我想执行GET请求以获取有关仅在登录后可用的用户的私有数据,并将此私有数据存储在redux存储中以供应用程序的各个部分使用.我怎么做?

Ser*_*aev 10

您应该使用异步操作来完成此操作.

您必须编写异步操作创建器,它将调用多个操作.

像这样的东西:

function multipleAtions() {
 return (dispatch) => { 
   dispatch(load_action);
   return fetch(`http://some_request_here`)
          .then(() => dispatch(another_action);
 }
}
Run Code Online (Sandbox Code Playgroud)