Create an Error Boundary for a React App
Uncaught errors in React used to leave your app in a corrupted state, since React 16.0, an uncaught exception in your render tree will cause your application to unmount. In this lesson, we’ll create a default error boundary to wrap our application as a starting point for new projects.
The behavior I get here is a bit different. Seems that react-hot-loader is catching the error and showing their own error boundary. If I view the built version (npm run build) in the browser THEN I see DefaultErrorBoundary, just not in development.
It might be that react-hot-loader had some updates regarding error boundaries since this video was published?
@Jake -> React hot loader is only for development and i can confirm that this happens as well, but since it won't have any issues in production its no problem. Also you can start dev without hot reload and works fine.
Maybe there is a solution somewhere but I haven't dug into it yet.
Does the getDerivedStateFromError method have to be specified as static? If so, why?
Does the
getDerivedStateFromErrormethod have to be specified as static? If so, why?
Yes. The React API specifies that it's defined as a static method on your component class - https://reactjs.org/docs/react-component.html#static-getderivedstatefromerror