React 팀은 개발자들의 피드백을 듣고 있다. 대부분의 라이프사이클 이벤트는 개발자가 컴포넌트의 행동을 조정할 수 있게 해준다. 라이프사이클 이벤트를 고수의 비급이라고 생각해두자. 라이프사이클 이벤트를 사용하지 않고 코드를 작성할 수도 있지만, 사용하면 더 강력한 코드를 작성할 수 있다. 흥미로운 점은 여전히 모범 사례와 사용법에 대해 이야기를 나누고 있다는 점이다. React는 여전히 진화 중이므로 향후 라이프사이클 이벤트에 변경 사항이나 추가되는 부분이 있을지도 모른다. 공식 문서를 확인하고 싶다면 https://reactjs.org/docs/react-component.html을 참고하기 바란다.
Note componentDidCatch( )
componentDidCatch()는 React 버전 16부터 소개된 새로운 라이프사이클 메서드로 오류나 예외 처리를 위해 사용할 수 있다. 공식 문서에서는 오류 경계(error boundaries)라는 개념을 소개하는데, componentDidCatch()를 선언한 컴포넌트 클래스를 말한다. componentDidCatch()가 선언된 컴포넌트는 하위 컴포넌트에서 발생하는 오류를 모두 처리할 수 있으므로 오류 경계라고 부르는 것이다. 예를 들어 최상위 컴포넌트에 componentDidCatch()를 선언하면 하위 컴포넌트에서 오류가 발생했을 때 해당 오류를 콘솔에서 확인하거나 오류 처리를 위한 UI를 노출할 수 있다. API는 다음과 같다.
componentDidCatch(error, errorInfo)
error는 발생한 오류다. errorInfo에는 객체가 전달되는데, 여기에 componentStack이라는 키로, 오류가 발생한 컴포넌트에 대한 스택 트레이스를 제공한다.
좀 더 자세한 정보는 공식 문서와 블로그 게시물에서 확인할 수 있다.
• https://reactjs.org/docs/react-component.html#componentdidcatch
• https://reactjs.org/blog/2017/07/26/error-handling-in-react-16.html