React 화살표 함수 사용시 컴포넌트 출력안됨

<div>
  {diaryList.map((it) => {
    <DiaryItem key={it.id}  {…it} />})
  }
</div>

// DiaryItem은 HTML을 반환한다.

이 부분에서 에러는 나지 않지만 출력이 되지 않는다...

<div>
  {diaryList.map((it) => (
    <DiaryItem key={it.id}  {…it} />))
  }
</div>

하지만 화살표 함수 () => {}를 () => ()부분으로 변경하면 출력이 된다.

다만 화살표 함수에서 객체를 반환하거나 JSX 요소를 반환할 경우 소괄호로 묶어주어야 한다고 한다.