README
flux-utils
A collection of utility classes for Flux implementation
Installing
npm install --save nova-flux
Using
First it's needed to create actions:
ES5:
var flux = require('nova-flux');
// To look more react-like
var MyActions = flux.createActions('createTodo', 'removeTodo');
// To look more classic
var MyActions = new flux.Actions('createTodo', 'removeTodo');
ES6:
import { Actions } from 'nova-flux';
var MyActions = new Actions('createTodo', 'removeTodo');
Actions can be called directly
// Actions can be called directly:
MyActions.createTodo(name, false); // Also, any number of arguments.
Then create an Store to use those actions:
ES5:
var flux = require('nova-flux');
// You ca use flux.createStore also
var MyStore = flux.createStore({
actions: MyActions,
methods: {
addTodo(name, done) {
let state = this.state; // deep copies it
state.todos.push({ name, done });
this.state = state; // Saves the new state and emit changes
},
removeTodo() {
}
},
state: { todos: [] }
});
ES6:
import { Store } from 'nova-flux';
// You ca use flux.createStore also
var MyStore = new Store({
actions: MyActions,
methods: {
addTodo(name, done) {
let state = this.state; // deep copies it
state.todos.push({ name, done });
this.state = state; // Saves the new state and emit changes
},
removeTodo() {
}
},
state: { todos: [] }
});
Now you can look out for events
When state is changed the event change is automatically fired:
Flux could be used without React but because is popular, here is a React component showing how it works.
class MyComponent extends React.Component {
// ... More code ...
onMyStoreChange = () => {
// when you get the state is deep cloned,
// so no worries and no change to modify it.
this.setState(MyStore.state);
}
componentWillMount() {
// Adding the handle
MyStore.events.on('change', this.onMyStoreChange);
}
componentWillUnmount() {
// Remove it when not needed
MyStore.events.off('change', this.onMyStoreChange);
}
// ... More code ...
}
Events are using my custom Event Manager and they are using composition, instead of inheritance.