Unform

Reset form

Reset form

Don't use the <input type="reset" /> to reset the form data. It won't work correctly with Unform and may cause bugs.

There are two ways to reset all form data:

1. Reset after submit

Besides the data, the onSubmit function also receives a second parameter with form helpers:

export default function SignIn() {
  function handleSubmit(data, { reset }) {
    console.log(data)
    reset()
  }
  return <Form onSubmit={handleSubmit}>...</Form>
}

2. Reset form manually

If you need to reset form data without a submit use the reset function exposed inside form reference.

export default function SignIn() {
  const formRef = useRef(null)
  function functionThatResetsForm() {
    formRef.current.reset()
    // You can also clear a single input value
    formRef.current.clearField('email')
  }
  return (
    <Form ref={formRef} onSubmit={handleSubmit}>
      <Input name="email" />
    </Form>
  )
}

Edit this page on GitHub

Prev

Get/set field error

Next

Manual form submit

On this page