Cách xác thực biểu mẫu bằng React Hook

Một bộ móc React dành cho các biểu mẫu hiệu quả, linh hoạt và có thể mở rộng với khả năng xác thực dễ sử dụng.

Cài đặt & Nhập khẩu:

# NPM
$ npm i react-hook-form –save

import React from ‘react’;
import { useForm } from ‘react-hook-form’;

Cách sử dụng cơ bản:

function App() {
  const { register, handleSubmit, errors } = useForm(); // initialize 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>
  );
}

Xem trước:

Tải xuống chi tiết:

Tác giả: Reac-hook-form

Bản demo trực tiếp: Xem bản demo

Liên kết tải xuống: Tải xuống mã nguồn

Trang web chính thức: https://github.com/react-hook-form/react-hook-form

Giấy phép: MIT