[TS] ReactNode

Jane·2023년 8월 15일
0

TypeScript

목록 보기
5/17
post-thumbnail

🌟 ReactNode

🦴 ReactNode 구조 파악하기

type ReactNode =
  | ReactChild
  | ReactFragment
  | ReactPortal
  | boolean
  | null
  | undefined;
  • ReactNode는 ReactChild, ReactFragment, ReactPortal, boolean, null 또는 undefined 중 하나가 되는 타입이다.

🗝️ ReactNode 사용하기

  • 모든 것을 허용하기 때문에 children 속성의 타입으로 가장 많이 사용하는 타입이다.
  • JSX.Element와 다르게 element, 원시값, portal, fragment 등등을 모두 받을 수 있다.
  • 클래스 컴포넌트의 render()가 기본적으로 리턴하는 타입

🤔 원시값은 허용되지 않는 것 아닌가?

  • string, number은 ReactChild에 포함되어 있다.
  • ReactChild
    - ReactNode의 타입을 적절히 제한한 타입
    - React 요소 객체 + 원시 타입 리터럴까지는 허용한다.

🔎 References

profile
An investment in knowledge pays the best interest🙃

0개의 댓글

관련 채용 정보