ReactJS componentDidCatch() Method Last Updated : 10 Aug, 2021 Comments Improve Suggest changes Like Article Like Report The componentDidCatch() method is invoked if some error occurs during the rendering phase of any lifecycle methods or any children components. This method is used to implement the Error Boundaries for the React application. It is called during the commit phase, so unlike getDerivedStateFromError() which was called during the render phase, side-effects are allowed in this method. This method is also used to log errors. Syntax: componentDidCatch(error, info)Parameters: It accepts two parameters i.e, error, and info as described below: error: It is the error that was thrown by the descendant component.info: It stores the componentStack trace of which component has thrown this error.Creating React Application: Step 1: Create a React application using the following command: npx create-react-app foldernameStep 2: After creating your project folder i.e. folder name, move to it using the following command: cd foldername Project Structure: It will look like the following. Project StructureExample: Program to demonstrate the use of componentDidCatch() method. Filename: App.js: JavaScript import React, { Component } from 'react'; export default class App extends Component { // Initializing the state state = { error: false, }; componentDidCatch(error) { // Changing the state to true // if some error occurs this.setState({ error: true }); } render() { return ( <React.StrictMode> <div> {this.state.error ? <div>Some error</div> : <GFGComponent />} </div> </React.StrictMode> ); } } class GFGComponent extends Component { // GFGComponent throws error as state of // GFGCompnonent is not defined render() { return <h1>{this.state.heading}</h1>; } } Step to Run Application: Run the application using the following command from the root directory of the project: npm startOutput: outputReference: https://reactjs.org/docs/react-component.html#componentdidcatch Comment More infoAdvertise with us Next Article ReactJS componentDidCatch() Method R rbbansal Follow Improve Article Tags : Web Technologies ReactJS Similar Reads ReactJS componentDidUpdate() Method In React, lifecycle methods allow you to manage the behaviour of components at different stages of their existence. One important lifecycle method for handling actions after updates have occurred is componentDidUpdate(). This method is called immediately after a component’s updates are applied to th 5 min read ReactJS componentDidMount() Method In React, componentDidMount() is a lifecycle method in React that is called once a component has been rendered and placed in the DOM. This method is invoked only once during the lifecycle of a component, immediately after the first render, which is why it is useful for operations like fetching data, 7 min read ReactJS isDOMComponent() Method React.js library is all about splitting the app into several components. Each Component has its own lifecycle. React provides us some in-built methods that we can override at particular stages in the life-cycle of the component. In this article, we will know how to use isDOMComponent() method. This 2 min read ReactJS componentWillUnmount() Method In React, lifecycle methods allow you to manage the behaviour of components at different stages of their existence. One important lifecycle method for cleaning up resources and side effects is componentWillUnmount(). This method is called just before a component is removed from the DOM, making it an 5 min read ReactJS UNSAFE_componentWillUpdate() Method The componentWillUpdate() method provides us the control to manipulate our React component just before it receives new props or state values. It is called just before the rendering of our component during the updating phase of the React Life-cycle ,i.e., this method gets triggered after the updation 3 min read Like