如何在redux中调度后返回操作结果?

时间:2016-05-26 23:13:47

标签: reactjs redux react-redux

我想使用已发送的动作结果并发送新动作。 有一个我想使用的代码示例

function mapDispatchToProps(dispatch) {
    return bindActionCreators({
        addApplication(data, vacancy_id) {
            dispatch(candidateActions.addCandidate(data))
                .then((newCandidate) => {
                          dispatch(applicationActions.addApplication(data.video, vacancy_id, newCandidate._id))
               });
        }
    }, dispatch);
}

如何在redux中执行此操作以及可以使用哪些库?

1 个答案:

答案 0 :(得分:4)

您应该使用thunk-middleware,它将根据之前操作的结果负责调度操作。通过使用thunk中间件,动作创建者可以返回一个能够调度自己动作的函数。

假设我有3个动作:

1. loginRequest - send credentials for login
2. loginSuccess - dispatch action if credentials are valid
3. loginFailure - dispatch action if login failed

我可以设置一个功能,执行以下操作

    export function login(credentials){
      return function(dispatch){
        dispatch(loginRequest(credentials){
           return fetch(`http://localhost:8000/login`)
             .then(response => response.json())
              .then(json =>
                 dispatch(loginSuccess(creds))
             .catch(err => 
                 dispatch(loginFailure(err))
              })
            }
          }

然后,您可以通过将其包含在mapDispatchToProps

中来从您的组件发送登录功能

您应该查看 - http://redux.js.org/docs/advanced/AsyncActions.html以获得更好的理解