createStore
is a custom state management package that provides a simple way to create and manage state in a React application.
npm install use-mini-store
import createStore from "use-mini-store";
export useStore = createStore({ count: 1 });
initialState
(Object): The initial state object.
Returns 🚀
Returns a function that generates a custom hook for accessing and managing state.
// use the returned hook from createStore to get and set state values
const [count, setCount, removeEvent] = useStore('count');
A custom hook generated by createStore for managing state.
key
(String): The key to access the specific state value.
An array with the following elements:
- The current state value.
- A function to update the state value.
- A function to remove the event listener associated with the state key (in case of unmount / dont need re render for that value).
// Example usage in a component
import createStore from 'use-mini-store';
const useStore = createStore({count: 1});
const Counter () => {
const [count, setCount] = useStore('count');
const increment = () => {
setCount(prev => prev + 1);
}
return <button onClick={increment}>{count}</button>;
}
- Components using the same state key will re-render when the state is updated.
- To stop listening to state changes and prevent unnecessary re-renders, call the removeEvent function returned by useStore.