Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

438
Vistas
reaccionar js Formik <Form/> resetForm() no funciona

Estoy tratando de restablecer las entradas en mi formulario formik al enviar. Parece que se supone que debo usar resetForm() para hacer eso, pero aparece el error:

src\components\CommentSubmition\inCommentSubmition.js Línea 19:13: 'resetForm' no está definido no-undef

Aquí está mi componente:

 import React from 'react'; import { Formik, Field, Form, ErrorMessage } from 'formik'; import {createComment} from '../../services/CommentLocalStorage.js' import * as Yup from 'yup'; function CommentForm(props){ return ( <Formik initialValues={{ autor: '', content: ''}} validationSchema={Yup.object({ autor: Yup.string().required('Required'), content: Yup.string().required('Required') })} onSubmit={(values, { setSubmitting }) => { setTimeout(() => { createComment(props.pageEnum, props.articleId, values.autor, values.content) setSubmitting(false); },400); resetForm(); }} > <Form> <label htmlFor="autor">Nome</label> <Field name="autor" type="autor" placeholder="Nome"/> <ErrorMessage name="autor" /> <br/> <label htmlFor="content">Comentário</label> <Field name="content" type="content" placeholder="Comentário" /> <ErrorMessage name="content" /> <br/> <button type="submit">Submit</button> </Form> </Formik> ); }; export default CommentForm;

Parece que la mayoría de la gente hace algo como esto:

 const formik = some configuration

Y luego lo usan como

 formik.resetForm()

Y en su lugar, estoy usando el componente Formik con todo lo que contiene (lo hice en base a un ejemplo disponible en los tutoriales oficiales). Si es posible, me gustaría mantenerlo así y aún así restablecer el formulario.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Pase resetForm como parámetro a su función onSubmit . Eso debería darle a su función acceso al método resetForm de Formik, eliminando así el error y restableciendo con éxito el formulario. Si desea utilizar algún método de la biblioteca formik dentro de su función onSubmit , primero pase un parámetro a la función para que pueda tener acceso al método formik. Déjeme saber si esto ayuda

 import React from 'react'; import { Formik, Field, Form, ErrorMessage } from 'formik'; import {createComment} from '../../services/CommentLocalStorage.js' import * as Yup from 'yup'; function CommentForm(props){ return ( <Formik initialValues={{ autor: '', content: ''}} validationSchema={Yup.object({ autor: Yup.string().required('Required'), content: Yup.string().required('Required') })} onSubmit={(values, { setSubmitting, {resetForm }) => { //<--- See here for code added setTimeout(() => { createComment(props.pageEnum, props.articleId, values.autor, values.content) setSubmitting(false); },400); resetForm(); }} > <Form> <label htmlFor="autor">Nome</label> <Field name="autor" type="autor" placeholder="Nome"/> <ErrorMessage name="autor" /> <br/> <label htmlFor="content">Comentário</label> <Field name="content" type="content" placeholder="Comentário" /> <ErrorMessage name="content" /> <br/> <button type="submit">Submit</button> </Form> </Formik> ); }; export default CommentForm;

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda