propTypes

📌 propTypes를 통한 props 타입 검증하기

컴포넌트의 필수 props를 지정하거나 타입을 지정할 때 propTypes를 통해 검증할 수 있다.

import PropTypes from 'prop=types';

const Button = ({text}) => {
	return <button>{test}</button>
}

Button.propTypes = {
	text: PropTypes.string // 해당 prop은 문자열 형태로 전달해야 한다는 것을 의미한다.
}

📌 isRequired로 필수 propTypes 설정하기

필수적으로 사용하여야하는 props의 경우에는 isRequired로 설정하여 props가 지정되지 않았을 경우 생길 수 있는 오류를 방지할 수 있다.

import PropTypes from 'prop=types';

const Button = ({text}) => {
	return <button>{test}</button>
}

Button.propTypes = {
	text: PropTypes.string.isRequired // 해당 prop은 필수적으로 값을 넣어줘야 한다는 것을 의미한다.
}

propTypes에서는 여러 종류의 타입을 설정할 수 있다. 더 많은 정보는 아래의 링크를 참조하면 된다.propTypes는 개발 시 필수 사항은 아니지만, 큰 프로젝트나 다른 여러 개발자들과 협업을 할 때, 해당 컴포넌트에 어떤 props가 필요한지 쉽게 알 수 있기에 개발 능률을 높일 수 있다.👍

 

https://ko.reactjs.org/docs/typechecking-with-proptypes.html

PropTypes와 함께 하는 타입 검사 – React