[React] prop-types 사용법 (Type 확인)

[React] prop-types 사용법

 

prop-types는 전달받은 props가 원하는 타입의 props인지 확인해 준다.

 

import React from 'react';

Food.propTypes = {
    greeting: PropTypes.string.isRequired,
    name: PropTypes.number.isRequired,
}

function App() {
    return (
        <Test
            greeting="hello"
            num=123
        />
    );
}

export default App;

greeting은 string이므로 true, name은 number이므로 true가 나온다.

 

isRequied를 적지 않으면 작성한 type뿐만 아니라 undefined일 때도 true가 나온다.

 

 

propTypes는 코드를 작성 할 때 발생할 수 있는 실수를 줄이는 데 도움이 된다.