Skip to content
๐Ÿ“‹ React hooks for forms validation without the hassle.
TypeScript Other
Branch: master
Clone or download

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci ๐Ÿž fix #1172 issue around remove with useFieldArray (#1173) Mar 8, 2020
.codesandbox ๐Ÿ“ฆ codesandbox with each PRs (#505) Nov 14, 2019
.github ๐Ÿ˜‘ codesandbox is required for questions/bug report Mar 12, 2020
.vscode ๐Ÿ˜ฌ fix name of prettier config file in vscode settings (#767) Jan 3, 2020
app ๐Ÿž close #1097 issue with useFieldArray formState (#1111) Feb 28, 2020
cypress ๐Ÿž fix issue around pre-pend (#1260) Mar 22, 2020
docs update readme language order Dec 25, 2019
examples ๐Ÿ“ƒ rename example to remoteTriggerFormSubmit Mar 25, 2020
src ๐Ÿ—ฟfix keyName without clobbering the data when it's already present (#โ€ฆ Mar 27, 2020
website ๐Ÿ“น update example.gif Dec 23, 2019
.eslintrc.js fix #998 with console.log and update lint Feb 9, 2020
.gitignore ๐Ÿ—‘ clean up ignore files Aug 26, 2019
.npmignore โœŒ๐Ÿป fix issue on clearError and remove codesandbox from npm (#878) Jan 21, 2020
.npmrc Fix some utility functions (#168) Jul 30, 2019
.prettierrc ๐Ÿ’…๐Ÿป prettier the whole code base and update script Sep 3, 2019
CODE_OF_CONDUCT.md Create CODE_OF_CONDUCT.md Apr 3, 2019
CONTRIBUTING.md โค๏ธ Uplift the Contributing instructions (#364) Oct 11, 2019
LICENSE ๐Ÿ“… update License Sep 15, 2019
README.md โค๏ธ include contribution with organizations Feb 29, 2020
cypress.json disable video capture in cypress.json at build Aug 12, 2019
jest.config.js intial commit Mar 6, 2019
package.json 5.1.3 Mar 22, 2020
rollup.config.js ๐Ÿ‘ fixed rollup output for umd (#1159) Mar 6, 2020
rollup.ie11.config.js ๐ŸŒšsupport IE11 (#1063) Feb 21, 2020
rollup.min.config.js ๐Ÿฅ‚improve on getting value (#246) Aug 23, 2019
setup.ts โš’ use mutationobserver-shim for unit test Sep 16, 2019
tsconfig.ie11.json Revert "๐ŸŒš add ts-polyfill to solve ie11 issues (#1018)" (#1040) Feb 17, 2020
tsconfig.jest.json Remove errors from Typescript usage (#54) Jun 5, 2019
tsconfig.json ๐Ÿ’… update exclude folders Aug 31, 2019
yarn.lock ๐ŸŽ update all packages (#1219) Mar 16, 2020

README.md

Performant, flexible and extensible forms with easy to use validation.

npm downloads npm dep npm Coverage Status

Tweetย Join the community on Spectrum

๐Ÿ‡ฆ๐Ÿ‡บEnglish | ๐Ÿ‡จ๐Ÿ‡ณ ็ฎ€ไฝ“ไธญๆ–‡ | ๐Ÿ‡ฏ๐Ÿ‡ต ๆ—ฅๆœฌ่ชž | ๐Ÿ‡ฐ๐Ÿ‡ทํ•œ๊ตญ์–ด | ๐Ÿ‡ซ๐Ÿ‡ทFranรงais | ๐Ÿ‡ฎ๐Ÿ‡นItaliano | ๐Ÿ‡ง๐Ÿ‡ทPortuguรชs | ๐Ÿ‡ช๐Ÿ‡ธEspaรฑol | ๐Ÿ‡ท๐Ÿ‡บะ ัƒััะบะธะน

Features

  • Built with performance and DX in mind
  • Embrace uncontrolled form validation
  • Improve controlled form's performance
  • Tiny size without any dependency
  • Follows HTML standard for validation
  • Compatible with React Native
  • Supports Yup, Joi, Superstruct or custom
  • Supports native browser validation
  • Build forms quickly with the form builder

Install

$ npm install react-hook-form

Links

Quickstart

import React from 'react';
import { useForm } from 'react-hook-form';

function App() {
  const { register, handleSubmit, errors } = useForm(); // initialise the hook
  const onSubmit = data => {
    console.log(data);
  };

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input name="firstname" ref={register} /> {/* register an input */}

      <input name="lastname" ref={register({ required: true })} />
      {errors.lastname && 'Last name is required.'}

      <input name="age" ref={register({ pattern: /\d+/ })} />
      {errors.age && 'Please enter number for age.'}

      <input type="submit" />
    </form>
  );
}

Backers

Thanks goes to all our backers! [Become a backer].

Organizations

Thanks goes to these wonderful organizations. [Contribute]

Contributors

Thanks goes to these wonderful people. [Become a contributor].

You canโ€™t perform that action at this time.