Is there a way to pass formik form values from a child component to a parent component and handle form submission in parent component only. I have a use case where I'm building a form for restaurant. The form will have many many fields. So I grou...

Is there a yup function that validates a specific length?   I tried .min(5) and .max(5), but I want something that ensures the number is exactly 5 characters (ie, zip code)....

I am trying to use Formik with Material-UI text field. Like so:  import TextField from '@material-ui/core/TextField'; import {   Field,   FieldProps,   Form,   Formik,   FormikErrors,   FormikProps } from 'formik'; import React, { Com...

I have the following form written in React using Formik:  import React, { FunctionComponent } from 'react'; import { NavLink } from 'react-router-dom'; import { object, string } from 'yup'; import { Formik, FormikActions, Fiel...

I've put together a pretty basic contact form that works just fine. However I now need to start writing my unit tests and I've run into a load of problems (like I literally have only managed to get a snapshot test to pass so far).  So to star...

I'm using Formik's Field component to render an input like this:  <Formik    initialValues={initialValues}   onSubmit={onSubmit}   render={formProps => (     <Form>       <Field name="lastName" render={({ field, form })...

I have search page in my NextJS application. URL example - /search?q=Naaarutoo. And for example after reloading I just want to set "Naaarutoo" as the input value (I know how to set query param to input value) IMMEDIATELY.   If we look closer...

I'm trying to use Yup along with Formik in my react form. The form fields are going to be dynamic so as their validations.   export const formData = [   {     id: "name",     label: "Full name",     placeholder: "Enter full na...

Question:   How to prevent submit if value hasn't changed?  I tried to do this using useState.  Snippet:  import React from 'react' import {Formik, Form, Field} from 'formik'  const Search = () => {    const [searchValue, setSe...

I am attempting to use react-spring's useSprings to enable users to reorder the items in a formik FieldArray. The useSprings Draggable List demo (found here) uses useRef to manage the order of items. FieldArray comes with a number of array helper...