exeform
  • Getting Started
  • Motivation
  • How It Works
  • Guides
    • Validation
    • Nested Structures
  • API
    • Form
    • Field
    • <Form />
    • useForm()
    • useField()
    • useCheckboxField()
    • useFieldValue()
    • useFormIsValid()
    • useFormContext()
Powered by GitBook
On this page
  • Import
  • Props
  • Example

Was this helpful?

  1. API

<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>;
};
PreviousFieldNextuseForm()

Last updated 3 years ago

Was this helpful?

Form