Skip to content
Docs
훅으로 돌아가기

useFormValidation

@hua-labs/ui/form

설치

bash
npm install @hua-labs/hua
Import
tsx
import { useFormValidation } from "@hua-labs/hua/framework";

@hua-labs/motion-core의 모션 훅을 @hua-labs/hua/framework에서 통합 제공합니다.

UI 컴포넌트, 모션 훅, i18n을 하나의 패키지로 사용할 수 있습니다.

기본 사용법

tsx
import { useFormValidation } from '@hua-labs/ui/form';

const { errors, validate, clearError } = useFormValidation();

function handleSubmit(e: React.FormEvent) {
  e.preventDefault();
  const isValid = validate({
    email: { value: emailValue, type: 'email' },
    password: { value: passwordValue, type: 'password' },
  });
  if (isValid) {
    // submit
  }
}

API 레퍼런스

옵션

이름타입기본값설명
initialErrorsValidationErrors-docs:hooks.use-form-validation.options.initialErrors

반환값

이름타입설명
errorsValidationErrorsdocs:hooks.use-form-validation.returns.errors
validate(rules: ValidationRules) => booleandocs:hooks.use-form-validation.returns.validate
clearError(field: string) => voiddocs:hooks.use-form-validation.returns.clearError
clearAllErrors() => voiddocs:hooks.use-form-validation.returns.clearAllErrors
setErrors(errors: ValidationErrors) => voiddocs:hooks.use-form-validation.returns.setErrors

사용 사례