[React] Error: Objects are not valid as a React child

Error: Objects are not valid as a React child (found: object with keys {$$typeof, render, attrs, componentStyle, displayName, shouldForwardProp, foldedComponentIds, styledComponentId, target, withComponent, warnTooManyClasses, toString}). If you meant to render a collection of children, use an array instead.

 

 

react를 실행했는데 해당 에러가 나온다면?

 

react child에 무슨 에러가 생긴것이다.

 

다양한 이유가 있겠지만 나같은 경우는 styled-component 사용에서 실수하여 에러가 발생하였다.

      

      

      

    
    

      <javascript />
    
const HeaderLink = styled(Link);

export default () => {
	return (
    	<HeaderLink/>
    );
}

 

위 코드의 문제점은 아주 간단하게도

 

      

      

      

    
    

      <javascript />
    
const HeaderLink = styled(Link)``;

export default () => {
	return (
    	<HeaderLink/>
    );
}

``를 빼먹고 사용했었다..

 

에러가 저 특정 파트를 가리키지 않고, 전체적인 reactDOM에러를 반환하니 찾기가 어려웠다.

한번 누르면 2시간동안 보이지 않아요 ㅎㅎ 이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

원치 않을 경우 를 눌러주세요