React, Next.js

[React] Fragment

쭈꾸미 2022. 1. 17. 14:51

Fragment란?


div나 span처럼 특정한 역할을 하지 않고 크게 묶어주는 기능만을 하는 요소.

 

문법


React JSX의 경우 최상위에 하나의 요소로 묶여있지 않으면 오류가 발생한다.

이런 경우에는 문제가 없지만
이런 경우에는 렌더링이 되지 않는다.

이럴 때 Fragment를 사용할 수 있다.

단, react에서 Fragment 를 import해야 사용 가능하다.

언어의 발달로 아래와 같은 빈 태그도 Fragment처럼 사용할 수 있다.

이 경우에는 별도의 import가 필요 없다.