You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 7-8.RSVP
Socket
Socket
Sign inDemoInstall

formik-persist-values

Package Overview
Dependencies
4
Maintainers
1
Versions
12
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

formik-persist-values

Persist and rehydrate a Formik values


Version published
Weekly downloads
871
decreased by-15.27%
Maintainers
1
Created
Weekly downloads
 

Readme

Source

Formik Persist Values

Persist and rehydrate a Formik form values.

npm install formik-persist-values --save
yarn add formik-persist-values

Basic Usage

Just import the <PersistFormikValues > component and put it inside any Formik form. It renders null!

import React from 'react';
import { Formik, Field, Form } from 'formik';
import { PersistFormikValues } from 'formik-persist-values';

export const Signup = () => (
  <div>
    <h1>My Cool Persisted Values</h1>
    <Formik
      onSubmit={values => console.log(values)}
      initialValues={{ firstName: '', lastName: '', email: '' }}
    >
      {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>
          <PersistFormikValues name="signup-form" />
        </Form>
      )}
    </Formik>
  </div>
);

Props

  • name: string: LocalStorage key to save form state to.
  • ignoreValues:? string[]: Provide array of keys if you need to do not persist some values.
  • debounce:? number: Default is 300. Number of ms to debounce the function that saves form state.
  • storage:? 'localStorage' | 'sessionStorage' | Storage: default is localStorage . Send if you want Session storage or your own storage instead of Local storage.
  • persistInvalid:? boolean: default is false . Persist if you want to save values while the form is invalid.
  • hashInitials:? boolean: default is false . Hash initials values to prevent conflict between initialValues and persistedValues.
  • hashSpecificity:? number: default is 7 . Hash initials values specificity to prevent conflict between cache hashes.

Author

Inspired by

Thanks

Keywords

FAQs

Package last updated on 02 Nov 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc