인프런 커뮤니티 질문&답변

민갱님의 프로필 이미지
민갱

작성한 질문수

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

React State 실습

수업 질문이용! event 관련해서...

해결된 질문

작성

·

263

0

 const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');

  // error State
  const [emailError, setEmailError] = useState('');

  //on 으로 시작하는 함수는 행동을 취할 때 마다 event 가 들어온다. => 이벤트핸들러함수
  function onChangeEmail(event) {
    console.log(event); //행위
    console.log(event.target); //행위 대상
    console.log(event.target.value); //그래서 입력한 값이 뭔지
    setEmail(event.target.value);
  }

  function onChangePassword(event) {
    setPassword(event.target.value);
  }

  //마지막 포장한 거 보내주기
  function onClickSignup() {
    //진짜 포장이 잘 됐는지 확인해보기
    console.log(email);
    console.log(password);

    //검증하기
    //@ 가 들어가 있지 않다면
    if (email.includes('@') === false) {
      // alert('이메일이 올바르지 않습니다!! @ 가 없음 !!');
      // document.getElementById('error').innerText = '이메일이 올바르지 않습니다!! @ 가 없음 !!';

      setEmailError('이메일이 올바르지 않습니다!! @ 가 없음 !!');
    } else {
      // 메시지 알림 이전, Backend 컴퓨터에 있는 API(함수) 요청하기
      alert('회원가입을 축하합니다!!');
    }
  }

onClicksignup 매개 변수로 event 를 써주지 않는 것은 이 함수는 입력값을 보내주지 않아서 그런걸까요 ?

on 이 붙은 함수가 모두 event 를 사용할 수 있다는 것으로 이해하면 될까요 ?

 

답변 1

0

노원두님의 프로필 이미지
노원두
지식공유자

네! 민갱님!

on으로 시작하는 속성에 바인딩 되어있는 함수는 event 핸들러 함수로 매개변수 자리에 event가 들어옵니다!
따라서, event를 작성하셔도 괜찮아요!
하지만, 해당 수업 내에서는 사용할 필요가 없었으므로 작성하지 않았을 뿐이랍니다!

민갱님의 프로필 이미지
민갱

작성한 질문수

질문하기