더북(TheBook)

3.3.6 propTypes를 통한 props 검증

컴포넌트의 필수 props를 지정하거나 props의 타입(type)을 지정할 때는 propTypes를 사용합니다. 컴포넌트의 propTypes를 지정하는 방법은 defaultProp을 설정하는 것과 비슷합니다. 우선 propTypes를 사용하려면 코드 상단에 import 구문을 사용하여 불러와야 합니다.

MyComponent.js

import React from 'react';
import PropTypes from 'prop-types';
 
const MyComponent = ({ name, children }) => {
(...)

 

PropTypes를 불러왔다면 코드 하단에 다음과 같이 입력해 보세요.

MyComponent.js

import React from 'react';
import PropTypes from 'prop-types';
 
const MyComponent = ({ name, children }) => {
  return (...);
};
 
MyComponent.defaultProps = {
  name: '기본 이름'
};
 
MyComponent.propTypes = {
  name: PropTypes.string
};
 
export default MyComponent;

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