README.zh-TW.md

高效能、靈活、易擴充、易於使用的表單

 

English | 繁中 | 簡中 | 日本語 | 한국어 | Français | Italiano | Português | Español | Русский | Deutsch | Türkçe

功能

• 感受效能與開發者體驗（DX）
• 使用原生表單驗證
• 簡單整合 UI 套件
• 輕巧 且沒有依賴
• 遵循 HTML 標準的 驗證
• 支援 Yup、Superstruct、Joi 等自定義 Resolvers
• 使用 Form Builder 快速建構表單

安裝

$ npm install react-hook-form

連結

• 動機
• 影片教學
• 開始
• API
• 範例
• Demo
• Form Builder
• 常見問題

快速開始

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

贊助者

想在這裡秀你的 Logo 嗎？在 Twitter 上私訊我

支持者

感謝所有支持者！ [成為支持者]

組織機構

感謝這些優質的組織！ [捐助]

貢獻者

感謝這些出色的人！ [成為貢獻者]