[TIL] 2023.09.19 - 유효성 검사

유효성검사 및 안내메시지 

• ID

// id
// 아이디 입력(6~20자)
  const [idMessage, setIdMessage] = useState("");

  useEffect(() => {
    if (id.length === 0) {
      setIdMessage("");
    } else if (!/^(?=.*[a-z])(?=.*[0-9])/.test(id)) {
      setIdMessage("영어 소문자와 숫자를 모두 포함해야 합니다.");
    } else if (id.length < 6) {
      setIdMessage("6글자 이상 입력해야합니다.");
    } else {
      setIdMessage(true);
    }
  }, [id]);

 

•  PW 

// pw
// 비밀번호 입력(문자, 숫자, 특수문자 포함 8~20자)
const [pwMessage, setPwMessage] = useState("");

  useEffect(() => {
    if (password.length === 0) {
      setPwMessage("");
    } else if (password.length < 8) {
      setPwMessage("비밀번호는 8글자 이상이어야 합니다.");
    } else if (!/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])/.test(password)) {
      setPwMessage("영어 소문자, 숫자, 특수문자를 모두 포함해야 합니다.");
    } else {
      setPwMessage(true);
    }
  }, [password, checkPassword]);