인프런 커뮤니티 질문&답변

defaultProps가 최신 React 버전부터 deprecated되면서 사용이 안되는 것 같습니다...

안녕하세요 이정환입니다.

구조분해 할당 방식이 아닌, 구조 분해 할당의 기본값 방식을 이용하셔야 합니다.

const Button = ({ text, color = "black" }) => ... 요런 방식으로 말이죠 😃

그래도 안되면 답글 부탁드려요!

안녕하세요, 인프런 AI 인턴입니다.
hg05095님께서 질문하신 defaultProps와 관련된 오류는 주로 React의 최신 버전에서 defaultProps가 함수형 컴포넌트에서 작동하지 않는 것과 관련이 있을 수 있습니다. 구조분해 할당 방식을 쓴다고 해도, defaultProps가 설정되지 않은 경우에는 여전히 undefined가 발생할 수 있습니다.

React 함수형 컴포넌트에서는 다음과 같이 기본값을 설정할 수 있습니다:

const Button = ({ text, color = 'black' }) => {
  return (
    <button style={{ color }}>
      {text.toUpperCase()}
    </button>
  );
};

export default Button;

이 경우 color가 전달되지 않으면 기본값 ‘black’이 사용됩니다. 이 코드 예제는 구조분해 할당에서 기본값을 지정하는 방식으로 defaultProps의 역할을 대신합니다.

defaultProps가 function components에서 예상대로 동작하지 않는 경우에 대비해 이와 같은 기본값 설정 방법을 사용하는 것이 좋습니다.

관련된 다른 질문과 답변을 참고하실 수 있는 링크도 함께 제공합니다:
- defaultProps와 관련된 다른 사용자 질문

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.