<Form />

This is a wrapper for the <form> element, it adds the form object to the context and disables browser validation. All other props are passed directly through to the DOM node.

Import

import { Form } from 'exeform';

Props

Name
Type
Default
Description

children

node

The content of the form

form *

The form object

Example

import { Form, useForm } from 'exeform';

const App = () => {
  const form = useForm({
    initialValues: { name: 'John' },
  });
  
  const handleSubmit = (event) => {
    event.preventDefault();
    form.touchAllFields();

    if (form.isValid) {
      console.log(form.values);
      form.reset();
    }
  };
  
  return <Form form={form} onSubmit={handleSubmit}>...</Form>;
};

Last updated