상세 컨텐츠

본문 제목

[ React.js ] Fragment 사용하기, return ( div 태그를 사용하고 싶지 않을 때

FrontEnd/React.js

by SangHoonE 2022. 3. 7. 17:07

본문

반응형

안녕하세요 상훈입니다.

react.js에서 return 내에 jsxhtml 요소를 작성해야할 때, 보통은 <div> 태그로 모든 항목을 감싸서 1개의 요소를 반환시키도록 합니다. 

그러나 이를 사용하고싶지 않을 때 Fragment를 사용할 수 있는데요,

이는 React Version 16 이상 사용이  가능합니다.

간단한 예시)

return (
	<div>
    	<h1> Hello? </h1>
    </div>
)

이렇게 return 부분이 작성되어져 있을 때,

return (
	<Fragment>
    	<h1> Hello? </h1>
    </Fragment>
)

혹은

return (
	<>
		<h1> Hello? </h1>
	</>
)

이렇게 작성할 수 있습니다.

 

관련글 더보기

댓글 영역