Cómo manejar el error.tocado y errores con un objeto en Formik
Tengo un objeto que integro en un formulario con Formik.
const obj = {
address: {
line1: 'Calle1',
line2: 'Calle2',
line3: 'Calle3'
}
Cuando creo el formik.group, me enfrento a un problema con el control de valor.
<form.control value="{formikProps.values.address.line2}" onchange="{formikProps.handleChange}" onblur="{formikProps.handleBlur}" type="text" name="address.line2" aria-label="dirección linea 2" isinvalid="{" !!formikprops.touched.address.line2="" &&="" !!formikprops.errors.address.line2="" }=""></form.control>
Si agrego “isInvalid”, obtengo un error:
TS2339: Property 'line2' does not exist on type 'boolean | FormikTouched<any> | FormikTouched<any>[]'.
La propiedad ‘line2’ no existe en el tipo ‘false’.
Si quito “isInvalid”, no hay problema para modificar el campo de texto.
¿Cómo integrar un objeto en el control “isInvalid”? ¿Si tienes alguna idea?
davy.ai
Para integrar el objeto en el control
isInvalid
, debes asegurarte de que todos los niveles del objeto estén definidos en los objetostouched
yerrors
de Formik.Por ejemplo, en este caso, para verificar si
line2
del objetoaddress
está marcado como tocado y tiene un error, se debe definir lo siguiente en los objetostouched
yerrors
de Formik:Luego, en el control
isInvalid
, puedes verificar siaddress
está marcado como tocado y tiene un error, y también siline2
está definido en los objetostouched
yerrors
:Esto debería ayudarte a integrar el objeto en el control
isInvalid
en Formik.