react-form

Hooks for managing form state and validation in React

Features

• Built with React hooks for React hooks
• Highly practical validation API with 1st-class asynchronous support
• Built-in validation debouncing with auto cancellation for stale validations
• Field Scoping for deeply nested form values
• No nonsense meta management for both forms and form fields
• Fully memoized for frequent and fast rerenders
• Flexible form API at the field, scope, and form levels

• Installation
• Examples
• API
• Validation Guide
• Field Scoping Guide

Sponsors

React Form is built and maintained by me, @tannerlinsley and I am always in need of more Patreon support to keep this project afloat. If you would like to contribute to my Patreon for React Form or my other open source libraries, visit my Patreon and help me out!

<tr>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width='200' src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/platinum.png">
    </a>
  </td>
   <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="250" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/platinum-placeholder.png">
    </a>
  </td>
   <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="250" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/platinum-placeholder.png">
    </a>
  </td>
</tr>

<tr>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width='200' src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/gold.png">
    </a>
  </td>
   <td align="center" valign="middle">
   <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="150" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/gold-placeholder.png">
    </a>
  </td>
   <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="150" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/gold-placeholder.png">
    </a>
  </td>
  </td>
   <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="150" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/gold-placeholder.png">
    </a>
  </td>
</tr>

<tr>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width='200' src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/silver.png">
    </a>
  </td>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="100" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/silver-placeholder.png">
    </a>
  </td>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="100" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/silver-placeholder.png">
    </a>
  </td>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="100" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/silver-placeholder.png">
    </a>
  </td>
  <td align="center" valign="middle">
    <a href="https://patreon.com/tannerlinsley" target="_blank">
      <img width="100" src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/silver-placeholder.png">
    </a>
  </td>
</tr>

<tr>
  <td valign="top">
    <a href="https://patreon.com/tannerlinsley">
      <img width='200' src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/supporters.png" />
    </a>
  </td>
  <td>
    <div><a href="https://patreon.com/tannerlinsley">Your Name and Link Here!</a></div>
  </td>
</tr>

<tr>
  <td valign="top">
    <a href="https://patreon.com/tannerlinsley">
      <img width='200' src="https://raw.githubusercontent.com/tannerlinsley/files/master/images/patreon/fans.png" />
    </a>
  </td>
  <td>
    <div><a href="https://patreon.com/tannerlinsley">Your Name Here!</a></div>
  </td>
</tr>