Do you have an input or checkbox you'd like to recover after a reload? Do you need to store your app's configuration page?
Just use storage hooks with localStorage to ensure data is fresh on the first hook call.
npm i just-storage-hooks
Read and write to localStorage.
Optional mutate function allows for storeState data to be altered before storing. This should be memo'd or unchanged between hooks.
const mutate = useCallback(data => `${data}`);
const [state, storeState] = useStorage(key, mutate);Debounce a callback when state changes. Used to avoid thrashing localStorage in the following hooks
const callback = useCallback((data) => { console.log(data); });
useDebounceCallback(state, callback, 10);Like useState but with localStorage when first starting the effect
const [state, setState] = useStorageState('key', { some: 'state' }, optionalMutate);Like useReducer but with localStorage when first starting the effect
const [state, dispatch] = useStorageReducer('key', reducer, { some: 'state' }, optionalMutate);Copyright (c) 2021, Michael Szmadzinski. (MIT License)