Support me for future versions:
stateux
Really simple Redux like lib without reducers for state control
/* Example using createStore utility ** state field its used as initial state ** all functions are binded to the store object ** you can also use Store.create*/; counter: 0 //initialState state: items: { thisstateitems; //the second parameter its the action name //its optional but can be usefull to subscribe ONLY to this action update if you want this; //this.dispatch function returns the state passed as parameter //so you can use a simplified dispatch and return //return this.dispatch(this.state); } { thisstateitems = thisstateitems; this; }; /* Example using useStore utility*/;; { const todoList = ; //you can also subscribe only to an action like add or remove //const todoList = useStore(TodoListStore, 'add'); const state setState = ; return <div> todoListitems <input type="text" defaultValue="" onChange= /> <button onClick= TodoListStore> Add </button> </div> }} /* Example using subscribe and unsubscribe + useEffect utility*/; { //you can also subscribe only to an action like add or remove //const todoList = useStore(TodoListStore, 'add'); const state setState = ; //more about useEffect: https://reactjs.org/docs/hooks-reference.html#cleaning-up-an-effect return <div> todoListitems <input type="text" defaultValue="" onChange= /> <button onClick= TodoListStore> Add </button> </div> }} /* Using class to create a Store */ ;//or//import { Store } from 'stateux'; { thiscounter = 0; thisstate = items: ; //set as initial state this; /* //you can set directly too and use this.getState() to get the state object this.initial({ items: [] }); let state = this.getState(); */ } { thisstateitems; //the second parameter its the action name //its optional but can be usefull to subscribe ONLY to this action update if you want this; //this.dispatch function returns the state passed as parameter //so you can use a simplified dispatch and return //return this.dispatch(this.state); ; } { thisstateitems = thisstateitems; this; } ; /* Using class components*/ ; Component { superprops context; //TodoListStore.subscribe returns the unsubscribe function thisunsubscribeTodoList = TodoListStore; /* //you can filter actions if you need //action parameter will be null if its the initial state this.unsubscribeTodoList = TodoListStore.subscribe((state, action) => { if(action === "add" || action === null){ this.setState(state); } }); //or you can subscribe passing a action name too //in this case will be called only if the action with this name is dispatched or if its the initial state this.unsubscribeTodoList = TodoListStore.subscribe((state) => this.setState(state), "add"); */ } { this; } { this; } { return <div> thisstateitems <input type="text" defaultValue="" onChange= this/> <button onClick= TodoListStore> Add </button> </div> } ;