Persist and rehydrate a Formik form.
npm install formik-persist --save
Just import the <Persist > component and put it inside any Formik form. It renders null!
import React from 'react'
import { Formik, Field, Form } from 'formik'
import { Persist } from 'formik-persist'
export const Signup = () =>
<div>
<h1>My Cool Persisted Form</h1>
<Formik
onSubmit={values => console.log(values)}
initialValues={{ firstName: '', lastName: '', email: '' }}
render={props =>
<Form className="whatever">
<Field name="firstName" placeholder="First Name" />
<Field name="lastName" placeholder="Last Name" />
<Field name="email" type="email" placeholder="Email Address" />
<button type="submit">Submit</button>
<Persist name="signup-form" />
</Form>}
/>
</div>;Only three props!
name: string: LocalStorage key to save form state todebounce:? number: Default is300. Number of ms to debounce the function that saves form state.isSessionStorage:? boolean: default isfalse. Send if you want Session storage inplace of Local storage
- Jared Palmer @jaredpalmer
- Alternative storages (localForage)
- Support AsyncStorage for React Native
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent