Open Qrysto opened 8 years ago
+1
If I dispatch an async action, the dispatch()
method will return a promise which, when resolved, will contain the original action. If you use redux-actions
you can then inspect the action if it has error = true
set and you know that your original promise was rejected.
Here's some sample code that will demonstrate that:
import { createStore, applyMiddleware } from 'redux';
import promiseMiddleware from 'redux-promise';
import RSVP from 'rsvp';
import { createAction, handleAction } from 'redux-actions';
const reducer = handleAction('TEST_ASYNC', (state = {}, action) => (
Object.assign({}, state, { payload: action.payload })
));
const store = createStore(reducer, applyMiddleware(promiseMiddleware));
const promise = new RSVP.Promise((resolve, reject) => {
const rand = Math.ceil((Math.random() * 10) + 1);
console.log(rand);
if (rand % 2 === 0) {
setTimeout(() => {
resolve("resolved");
}, 1000);
} else {
reject("rejected");
}
});
const action = createAction('TEST_ASYNC');
const dispatchResult = store.dispatch(action(promise));
console.dir(dispatchResult);
dispatchResult.then((result) => {
if(result.error) {
console.log(`Promise was rejected with payload: ${result.payload}`)
} else {
console.log(`Promise was resolved with payload: ${result.payload}`)
}
});
+1
This is the case: in my components I want to do some custom actions depends on whether the api call succeeds or fails, like redirecting or showing some messages. I want something like this
But the problem is redux-promise returns the result of the
promise.then()
instead of the original promise itself, and according to the answers here http://stackoverflow.com/questions/34222818/native-promise-chaining-with-catch, then the promise i receive fromdispatch
will always go to onResolve and never onReject (in case of error it will resolve anundefined
result). So should redux-promise return the original promise so that we can registerthen()
andcatch()
to the returned result ofdispatch()
?