인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

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

mspark님의 프로필 이미지

작성한 질문수

[리액트 2부] 고급 주제와 훅

[1.4장 장바구니 화면] 1.4.8 OrderForm, 비제어 컴포넌트

FormControl 컴포넌트 사용시 htmlFor prop 값 넘길 때 중괄호 이유

작성

·

53

1

안녕하세요, 강의 잘 보고 있습니다 😀

FormControl 컴포넌트 사용시 htmlFor prop 값 넘길 때 문자열을 중괄호로 감싸서 넘기는데요,

"label" prop의 값은 문자열을 그냥 전달하는데, htmlFor의 값은 문자열을 중괄호로 감싸서 전달하는 이유가 뭘까요 ? 그냥 문자열만 보내면 안되는건가요 ?

답변 1

0

김정환님의 프로필 이미지
김정환
지식공유자

안녕하세요, 수강해 주셔서 감사합니다.

좋은 질문을 주셨는데요, 핵심은 JSX 문법에서의 차이입니다.

  • label="이름" 처럼 따옴표 안에 값을 넣으면 문자열 리터럴로 전달됩니다.

  • htmlFor={"name"} 처럼 중괄호를 사용하면 자바스립트 표현식으로 전달됩니다.

프롭 인자에 문자열만 전달하면 둘 다 사용할수 있습니다.

한편, 표현식으로 문자열을 전달할 경우에는 중괄호를 사용하시면 좋습니다.

  • 예: htmlFor={`${name}`}

mspark님의 프로필 이미지

작성한 질문수

질문하기