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

Kang.__.Mingu님의 프로필 이미지
Kang.__.Mingu

작성한 질문수

[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

8.6) Update - 투두 수정하기

9분 40초쯤 삼항 연산자에 관하여 질문 있습니다

작성

·

218

0

{isEdit ? (
<>
<button onClick={handleQuitEdit}>수정 취소</button>
<button onClick={handleEdit}>수정 완료</button>
</>
) : (
<>
<button onClick={handleClickRemove}>삭제하기</button>
<button onClick={toggleIsEdit}>수정하기</button>
</>
)}
 
? 다음 <>...</> 빈 태그는 왜 써주시는 건가요?

답변 1

0

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

안녕하세요 이정환입니다.

<></>는 React.Fragment입니다.

React가 사용하는 JSX에는 모든 JSX Element는 단 하나의 최상위 태그를 가져야 한다는 규칙이 있습니다.

따라서  <div></div>로 보통 많이 묶어주고는 하는데 만약 별도 Element태그를 최상위 태그로 두고 싶지 않을 때 React.Fragment를 활용합니다.

자세한 내용은 본 강의의 JSX 파트를 참고하시면 알 수 있습니다.

 

Kang.__.Mingu님의 프로필 이미지
Kang.__.Mingu

작성한 질문수

질문하기