Part8_JSX_to_TSX
이효경
이야기해보기

8 JSX에서 TSX로

8.1 리액트 컴포넌트의 타입

  • 리액트 내장 타입 중에는 역할이 명확한 것도 있지만 역할이 비슷해 보이는 타입도 존재하기 때문에 어떤 것을 사용해야 할지 헷갈릴 때가 있다.
  • 이 절에서는 헷갈릴 수 있는 대표적인 리액트 컴포넌트 타입을 살펴보면서 상황에 따라 어떤 것을 사용하면 좋을지 그리고 사용할 때의 유의점은 무엇인지 알아보자.

8.1.1 클래스 컴포넌트 타입

interface Component<P = {}, S = {}, SS = any>
  extends ComponentLifecycle<P, S, SS> {}
 
class Component<P, S> {
  /* ... 생략 */
}
 
class PureComponent<P = {}, S = {}, SS = any> extends Component<P, S, SS> {}
  • 클래스 컴포넌트가 상속받는 React.Component와 React.PureComponent의 타입 정의는 위와 같으며 P와 S는 각각 props와 상태를 의미한다.