onSubmit 이벤트 (이벤트함수 생성, 디버깅으로 값 확인, 인자넣어주기, 매개변수넣어주고 출력 확인하기)

1. 이벤트 함수 생성

<App.js에서>

else if에 선언한 <CreateContent>가 어떻게 동작할지 onSubmit이벤트로 처리해줍니다.

   _title, _desc 값으로 컨텐츠값을 더해주도록 만들어줍니다.

 

 

 

2. 디버깅으로 값 확인

<CreateContent.js에서>

onSubmit 함수에서 App.js에 있는 내용이 실행되도록 합니다.

 

 

 

<브라우저에서>

3. 일단 debugger을 입력해줘서 e에 있는 이벤트객체를 잘 찾아줍니다.

value값이 잘 들어갔는지 확인하기 위해서 e.target.title.value를 입력해줍니다.

다행이 "react"로 잘 들어왔네요.

이것으로 CreateContent.js파일에 이벤트처리에 인자 값을 무엇을 넣어줄지 정해지게 됩니다.

 

 

 

 

 

3. 인자 넣어주기

onSubmit이벤트에 인자로 e.target.title.value 와 e.target.desc.value를 넣어줍니다.

 

 

 

 

4. 매개변수 넣어주고 값 확인하기

매개변수로 _title, _desc를 입력해줍니다.

 

 

잘 작동이 되는지 한번 브라우저에서 로그로 확인해봅니다.

 

잘 동작하는것을 확인 했습니다.