Store

In Flux philosophy Store are places to keep and manage the state of the scoped related data.

In Sinux, each Store are independent and are in charge of managing their scope of data. There is no one big store but many of them that responds to a bench of signals to mutate their state.

Stores expose signals and are tidily coupled to them.

Creating a store

Store constructor take a first parameter that is the initialState of the store. Other parameter are infinite list of Signals the store will expose.

const add = new Signal('add');
const remove = new Signal('remove');
const myStore = new Store({foo:'bar'}, add, remove); // etc..

To add Signals after initialization call the addSignals method

const update = new Signal('update');
const getSignal = new Signal('get');
myStore.addSignals(update, getSignal);

There is a simple way to define store's Signal than creating them and adding them to the store. You can pass strings directly to the constructor and the addSignals method.

const myStore = new Store({ foo: 'bar' }, 'add', 'remove');
myStore.addSignals('update', 'get');

When a Signal is added to a Store, you can access it through the store reference and it's name using the dot notation.

const remove = new Signal('remove');
const myStore = new Store({}, 'add', remove);
myStore.add
myStore.remove // equals to

Using store's signals

Once your store is define you can dispatch signal by invoking the dispatch signal function.

myStore.add.dispatch()

Signals defined in store are turned in functions that dispatch signal. Those functions inject state as first parameter and use the result to update the store state. (see Command)

myStore.add({props: 1});

myStore.update({foo: 'bar!'});

If you want a special behaviour that will not update the store, not pass the current state, or if you want to implement an update store differently do what follow.

myStore.add.dispatch({ props: 1 }).then((result) => {
 // do what you want with the result
  myStore.updateState(result);
});

In this way signal act as normal signal.

Predefined store signals

Store come with two reserved signal. changed and resetStore

changed

changed is dispatched every time the state of the store changed.
In order to listen for a state change, add a listener on the changed signal.

myStore.changed.add((state) => console.log(state} });

resetStore

Reset store is a signal used to reset the state of the store to its initial state.

myStore.resetStore(); // equal to mystore.resetStore.dispatch()

Get store's state

In order to retrieve the state of the store use the method getState

myStore.getState(); // return an object {}

Forcing store state update without signal

If necessary, call updateState to update the state and trigger a changed signal.

myStore.updateState({...myStore.getState(), ...{}});

updateState will copy it's current state and the object you will pass to the function. In that way you can update part of the Store's state without copying the all state.

myStore.updateState({foo: 'bar'});
myStore.updateState({hello: 'world'});
myStore.getState(); // { foo: 'bar', hello: 'world' }
myStore.updateState({...myStore.getState() , hello: 'sinux' });
myStore.getState(); // { foo: 'bar', hello: 'sinux' }

results matching ""

    No results matching ""