React-hook-form, yup, 정규표현식을 사용한 회원정보 입력 오류 처리
·
TIL
기능 구현 중 input에 들어간 value가 없다면 아무런 에러 메시지를 보여주지 않고 input에 value가 있는데 정규표현식에 위배된다면 에러 메시지를 보여주려고 했습니다. 처음엔 기존 코드에서 사용되었던 matches()의 내부에서 if문으로 기능을 구현하려 했으나 matches()의 사용법에 맞지 않아 실패했는데요. 알고보니 matches()는 첫 번째 인자로 정규표현식을, 두 번째 인자로 조건에 따른 텍스트를 넣어주는 것으로 지정되어 있었습니다. matches(정규표현식 조건, '조건에 맞지 않을 시 노출되는 텍스트') // 예시 코드 phoneNumber: yup .string() .matches(REGULAR_EXPRESSION.example, '형식 오류입니다.') .required()..