0
votes

Hi i'm using Formik and Yub library to validate Forms .I'm stuck in uncontrolled input of text to be controlled

In the beginning i have problem that Initial Values and i fixed with enableReinitialize={true} in Formik .But now with Field. On the document says Field can automatically inject onChnange and need props for input here

So I did like this

import { Formik, Form, Field } from 'formik';

<Formik
            initialValues={intialData}
            validationSchema={validationRules}
            onSubmit={e=>console.log(e)}
          >
            {({ errors, setFieldValue, setFieldTouched, values, handleChange }) => (
         <Form>
         <Field name="name" value={data.name} /> //i have tried explicitly added type="text"   
          {error.name ? errors.name: ''}
        </From>
           )}
      </Formik>

I didn't use onChange because Field automatically inject .But by giving like this

  <Field name="name" value={data.name} />

i can't edit on field shows uncontrolled error so I tried like this

  <Field name="name" defaultValue={data.name} /> // without giving onchange this also cant edit 

so I tried like this 

<Field name="name" defaultValue={data.name||""}/> // its working but the warning about uncontrolled input not going away

How get rid uncontrolled issue in Formik field .Im i doing in right way?

1

1 Answers

0
votes

the Initial value is my issue i fixed with this answer