I've always used redux-thunk or some sort of middleware that grants me access to dispatch/getState
, but I have a question that keeps bugging me. Why using that when we can import
our store
and call store.dispatch()/store.getState()
.
Later edit:
As a quick example, here's the original code:
function loadData(userId) {
return dispatch => fetch(`http://data.com/${userId}`) // Redux Thunk handles these
.then(res => res.json())
.then(
data => dispatch({ type: 'LOAD_DATA_SUCCESS', data }),
err => dispatch({ type: 'LOAD_DATA_FAILURE', err })
);
}
Basically, what I'm asking is why is it bad to rewrite this as:
import store from 'our-store';
function loadData(userId) {
return fetch(`http://data.com/${userId}`)
.then(res => res.json())
.then(
data => store.dispatch({ type: 'LOAD_DATA_SUCCESS', data }),
err => store.dispatch({ type: 'LOAD_DATA_FAILURE', err })
);
}