js401-reading

Redux - Asynchronous Actions

THUNK

• typical example if async call and action

let api = 'https://api.mockable.io/api/v1/stuff';

export const get = () => dispatch => {
  return utils.fetchData(api).then(records => {
    dispatch(getAction(records));
  });
};

const getAction = payload => {
  return {
    type: 'GET',
    payload: payload,
  };
};

• thunk middleware

export default store => next => action =>
  typeof action === 'function'
    ? action(store.dispatch, store.getState)
    : next(action);

• this allows for curried functions
  • func store => next => action => more is curried. They happen in sequence

Resources

videos

• dan abramov on suspense

articles

• async actions
• thunk middleware
• redux thunk
• suspense

This site is open source. Improve this page.