React Persist 💾
Persist and rehydrate React state to localStorage.
npm install react-persist --save
Basic Usage
Just import the <Persist >
component and pass it the data you want it to persist. It renders null
, so it can go wherever you need it to....
Component state = firstName: '' lastName: '' email: '' isLoading: false error: null ; // ... { return <form onSubmit=thishandleSubmit> /* whatever....*/ <Persist name="signup-form" data=thisstate debounce=500 onMount= this /> </form> }
Props
Only a few of them!
name: string
: LocalStorage key to save form state todata: any
: Data to persistdebounce:? number
: Number of ms to debounce the function that saves form state. Default is300
.onMount: (data: any) => void
: (optionally) Hydrate your data (into React state). Will only be called if data is notnull
.
Author
- Jared Palmer @jaredpalmer
Todo
- Alternative storages (localForage, sessionStorage)
- Support AsyncStorage for React Native