-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
15강에서 props 로 function 을 넘겨주는 코드 문의 드립니다
22.01.29 00:06 작성 조회수 170
1
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
Form 컴포넌트에 선언되어 있던 handleFormSubmit() 을 App 컴포넌트로 이동 후 Form 컴포넌트로 handleFormSubmit() 를 넘겨 주기 위해서 다음과 같이 코드를 작성하는데요.
const Form = ({ handleFormSubmit }) => {
return (
<form onSubmit={handleFormSubmit}>
<input type="text" name="name" placeholder="영어 대사를 입력해주세요" />
<button type="submit">생성</button>
</form>
)
}
props 로 handleFormSubmit 형태로 넘겨주지 않고 {handleFormSubmit} 형태로 넘겨주는 이유는 무엇인가요?
( {..} 형태는 html tag 시 react 의 표현식을 넘겨줄 때 사용하는 것으로 이해하고 있었습니다 )
답변을 작성해보세요.
1
0
진유림
지식공유자2022.01.29
보내주신 코드가 prop을 통해 넘기는 방법이에요~ ㅎㅎ
const Form = ({ handleFormSubmit }) => {
handleFormSubmit();
const Form = (props) => {
props.handleFormSubmit();
위 코드와 아래 코드는 동일합니다.
이는 자바스크립트의 Destructuring(구조 분해 할당) 이라는 문법이에요.
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
위 링크 보시면 이해갈거예요~!
또 궁금하신 점 있으면 질문 주세요.
답변 2