[React] DefaultProps

---

DefaultProps

자식 Component에서 props가 필요하지만 부모에서 자식에게 전달할 값이 없을 경우에 Default 값을 정할 때 사용

---

자식 Component

import React from 'react';

function MyName(props) {
    return (
        <div>
            안녕하세요! 제 이름은 <b>{props.name}</b>입니다.
        </div>
    );
}

MyName.defaultProps = {
    name: 'DefaultName'
}

export default MyName;

• defaultProps 설정을 진행

Class Component와 Function Component 모두 동일한 방법 사용 가능

부모 Component

import React from 'react';

import MyName from  './MyName';

function App() {

    return (
        <MyName />
    );
}


export default App;

• 이와 같이 props 지정이 안된 경우에도 오류가 발생하지 않음

---

결과

• 설정한 DefaultProps 값이 정상적으로 출력되는 것을 확인할 수 있음

감사합니다.