Common Error Handling in React Redux Application

Question

My application makes multiple api calls at a time from different actions. Suppose 4/12 actions give error response, Store needs to get update with all error messages(An array of 4 error messages). Finally I need to display all 4 errors popups at header. I heard of redux catch. Can anyone explain with sample code.

Does this answer your question? Best practice to handle errors in Redux and React — Michael Freidgeim
– Michael Freidgeim, Commented May 14, 2021 at 21:54

Mushfiq · Accepted Answer · 2017-11-05 09:44:25Z

2

If you are using middleware,

import { createStore, applyMiddleware } from 'redux';

import reduxCatch from 'redux-catch';

import reducer from './reducer';

function errorHandler(error, getState, lastAction, dispatch) {
  console.error(error);
  console.debug('current state', getState());
  console.debug('last action was', lastAction);
  // optionally dispatch an action due to the error using the dispatch parameter
}

const store = createStore(reducer, applyMiddleware(
  reduxCatch(errorHandler)
));

See detailed doc on Redux-catch.

Also, check these questions:

redux-promise with Axios, and how do deal with errors?

Best practice to handle errors in Redux and React

answered Nov 5, 2017 at 9:44

Mushfiq

7691 gold badge8 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Common Error Handling in React Redux Application

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related