클래스형 컴포넌트에서 defaultPropspropTypes를 설정할 때 class 내부에서 지정하는 방법도 있습니다.

    MyComponent.js

    import React, { Component } from 'react';
    import PropTypes from 'prop-types';
     
    class MyComponent extends Component {
      static defaultProps = {
        name: '기본 이름'
      };
      static propTypes = {
        name: PropTypes.string,
        favoriteNumber: PropTypes.number.isRequired
      };
      render() {
        const { name, favoriteNumber, children } = this.props; // 비구조화 할당
        return (...);
      }
    }
     
    export default MyComponent;

     

    노트 defaultProps와 propTypes는 꼭 사용해야 하나요?

    이 두 가지 설정은 컴포넌트의 필수 사항이 아니므로 꼭 사용할 필요가 없습니다. 하지만 여러분이 React를 사용하여 큰 규모의 프로젝트를 진행한다면, 특히 다른 개발자들과 협업한다면 해당 컴포넌트에 어떤 props가 필요한지 쉽게 알 수 있어 개발 능률이 좋아질 것입니다.

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.