componentDidCatch() 부분에서 크로쓰 오리진 에러가 뜹니다.

미해결질문
킹덤시즌2 프로필

componentDidCatch() 부분에서 저는 크로쓰 오리진 에러가 뜨네요... A cross-origin error was thrown. React doesn't have access to the actual error object in development. See https://fb.me/react-crossorigin-error for more information. 뭐가 문제인지 알 수 있을까요? (코드 https://codesandbox.io/s/5klql536vk)

홍성민 프로필
홍성민 2019.05.26

 App 컴포넌트 마운팅 과정에서 호출되는 render에서 자식 컴포넌트인 MyComponent의 render를 호출하게됐고 그 과정에서 에러가 발생해서 마운팅을 성공하지 못하고 App클래스의 componentDidMount에서 getBoundingClientRect() 정보를 호출하니 이곳에서 에러가 발생한것 같습니다. 강사님 말로는 부모 컴포넌트에서 에러를 잡을 수 있다고 했으니 App컴포넌트에서 발생한 에러를 App 컴포넌트 내 componentDidMount  에서 잡는게 안되서 문제가 된것 같습니다. 

임시 방편으로 주석처리하면 우선 componentDidMount  에서 에러가 발생하지 않아 componentDidCatch호출이 가능했습니다.

// console.log(this.myDiv.getBoundingClientRect());

지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스