watchable-stores

Data model with observer / observable pattern for front-end purpose.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
watchable-stores
002.0.26 years ago7 years agoMinified + gzip package size for watchable-stores in KB

Readme

watchable-stores
Data model with observer / observable pattern for front-end purpose.
The lib is very easy to use :
dashboard view
We can define an interface to represent the data stored in the Store (here: IUserData).
Then, we create our store, by instanciating a new class extending WatchableStore. In the constructor, we have to invoke the super method, it will pass the content as initial data to our store.
WatchableStore provides us 2 methods : - watch(cb: (data: IUserData) => any): number; - unwatch(id: number): void;
Here are how we can use it.
dashboard view dashboard view
Our first class is a React class that just render a text input. The second one displays the list of users.
In the first one, when we click on the "Add user" button, it will trigger the function addUser of our store. By doing this, all the components listening our store will be notified that the data has been updated. It means that our second class "UserList" will be able to manage the new users.

/!\ Do not forget to unwatch the store when you destroy your component.