0

I create a React App, and I need to make an async request with Redux, I want to use redux-thunk to get but get this error.

Uncaught Error: Actions must be plain objects. Use custom middleware for async actions

this is my code:

export function firewall(state = { data: [], loading: false, error: false }, action) {
  switch (action.type) {
    case 'REQUESTED_DATA_FAILED':
      return {
        data: [],
        loading: false,
        error: true,
      };
    case 'REQUESTED_DATA_SUCCEEDED':
      return {
        data: action.data,
        loading: false,
        error: false,
      };
    case 'REQUESTED_DATA':
      return {
        data: [],
        loading: true,
        error: false,
      };
    default:
      return state;
  }
}
const requestData = () => {
  return { type: 'REQUESTED_DATA' }
};

const requestDataSuccess = (data) => {
  return { type: 'REQUESTED_DATA_SUCCEEDED', data: data }
};

const requestDataError = () => {
  return { type: 'REQUESTED_DATA_FAILED' }
};

export const getFirewall = () => {
  return dispatch => {
    dispatch(requestData())
    request('/list', 'get')
      .then(res => 
       dispatch(requestDataSuccess(formatData(res.data))))
      .catch(error => dispatch(requestDataError()))
  }
}

and this is my store

import { createStore, applyMiddleware } from 'redux'
import thunk from 'redux-thunk';
import { Reducers } from './reducer'

export const store = createStore(
  Reducers,
  applyMiddleware(thunk)
);
2
  • return the request in your getFirewall action creator. In addition, your other creators should be structured like so export const example = (passedinparams) => dispatch => return dispatch({ type: example, payload: data }) Oct 14, 2018 at 13:26
  • It seems like the thunk middleware is not "working". Please double check, maybe put a breakpoint inside it and see if it's called. Oct 18, 2018 at 15:03

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.