Использование thunks в mapDispatchToProps

Question

Мне интересно, как использовать async action creators в mapDispatchToProps для react-redux's connect. Я использую redux-thunk промежуточное программное обеспечение и следующее мое mapDispatchToProps:

function mapDispatchToProps(dispatch) { 
    return { 
     foo: function() { 
      dispatch(someAction()); 

      return function asyncAction(dispatch, getState) { 
       console.log("An async action!"); 
       dispatch(someOtherAction(getState().foo)); 
      }; 
     } 
    } 
} 

Однако, когда я выше, действие асинхронной не получает казнены. Каков правильный способ сделать это?

Answer 1

Я предлагаю по-разному заявить ваш фактический thunk (someOtherAction). В следующем примере asyncAction является создателем асинхронного действия, который возвращает thunk. Затем он может отправлять другие действия (после того, как, например, обещание разрешится).

function asyncActionCreator() { 
    return (dispatch, getState) => { 
    dispatch(someAction()); 

    someAsyncStuff().then(() => { 
     dispatch(someOtherAction(getState().foo); 
    }); 
    } 
} 

function mapDispatchToProps(dispatch) { 
    return { 
    foo:() => dispatch(asyncActionCreator()) 
    } 
}