[React] 회원가입 유효성 검사(react-material-ui-form-validator 라이브러리 사용)

회원가입 기능에 유효성 검사가 필요해 react-material-ui-form-validator 라이브러리를 사용했다.

이 라이브러리가 제공하는 validator는 required, isEmail 등이 있는데 제공되는 것 외에도

필요한 validator를 쉽게 추가해서 사용할 수 있다.

 

Email 중복검사를 위한 validator가 필요했는데 기본으로 제공하지 않아 custom rule를 추가해서 사용했다.

아래와 같이 ValidatorForm.addValidationRule()을 사용하면 된다.

  useEffect(() => {
    ValidatorForm.addValidationRule("isRegisteredEmail", (value: string) => {
      if (emailList?.some((email) => email === value)) {
        return false;
      }
      return true;
    });
  }, [email, emailList]);

 

전체 코드는 아래에서 확인할 수 있다!