As far as I understand React-Flux architecture, Flux Actions
classes should propagate their events to Store
classes via AppDispatcher
.
However, I saw a few examples were Action
classes are getting data directly from a Store
class in order to execute some operations...
example:
import ... /* a few more imports */
import AppDispatcher from 'AppDispatcher.js';
import SomeStore from 'SomeStore.js';
class SomeActions {
processItemData(){
var item = SomeStore.getCurrentItem();
.
.
// do something with the item
.
.
// then data dispatched (anyway) to SomeStore or maybe other Store class
AppDispatcher.dispatch({...});
}
}
As I see it - importing here SomeStore.js
breaks the Flux
architecture and the way the data flows in the app.
The question is, is this normal? isn't it bad practice?
As you thought this is incorrect and breaks the concept of uni-directional data flow. The action could process data provided to it by the component, but I don't see why it would need to, or should, require any data or knowledge from the store.
This breaks the principle of inversion of control, as the action then needs knowledge of the store's custom implementation, instead of simply dispatching an event with data on it - this is the kind of architecture which flux is trying to avoid!