Issue with using Middleware to Handle Asynchronous Actions

JavaScript
1

Tell us what’s happening:
I’m not very good with Redux, so when I couldn’t get the conditions to say ‘I pass’,
It says I’m not dispatching my actions in the right places.
I’m just scratching my head.
Your code so far


const REQUESTING_DATA = 'REQUESTING_DATA'
const RECEIVED_DATA = 'RECEIVED_DATA'

const requestingData = () => { return {type: REQUESTING_DATA} }
const receivedData = (data) => { return {type: RECEIVED_DATA, users: data.users} }

const handleAsync = () => {
  return function(dispatch) {
    // dispatch request action here
    store.dispatch(requestingData());
    setTimeout(function() {
      let data = {
        users: ['Jeff', 'William', 'Alice']
      }
      // dispatch received data action here
      store.displatch(receivedData(data));
    }, 2500);
    
  }
};

const defaultState = {
  fetching: false,
  users: []
};

const asyncDataReducer = (state = defaultState, action) => {
  switch(action.type) {
    case REQUESTING_DATA:
      return {
        fetching: true,
        users: []
      }
    case RECEIVED_DATA:
      return {
        fetching: false,
        users: action.users
      }
    default:
      return state;
  }
};

const store = Redux.createStore(
  asyncDataReducer,
  Redux.applyMiddleware(ReduxThunk.default)
);

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:

1 Like
2

Well, first off, store.displatch is not a method of store. Check your spelling.

And with that it will pass. But I should say that for those to dispatch actions, you should just use dispatch and not store.dispatch. In this case either will work, but only because everything is in the same file. Normally it is not and that is why dispatch is passed into your thunk as a parameter - that’s how you should use it. Yes, they point to the same thing in this rare case. In normal usage you’d probably get an error that store isn’t defined, etc.

5 Likes
3

Thanks.
I must be losing my touch!
That’s the second similar typo I’ve made in as many coding sessions…

4

You will always make them. As you get better, you’ll get better at finding them.

1 Like