DEV Community

Cover image for How to Resolve Component Error In Lightning Web Component
Aditi Narayana
Aditi Narayana

Posted on

How to Resolve Component Error In Lightning Web Component

In lightning web component has excellent feature errorCallback which creates a error boundary. This error boundary captures all errors from its descendent component tree for life cycle events.errorCallback handler should be put in parent or container components. This will help us in getting all errors from child or grand child components. We can show errors in UI based on our UI design.

Here is parent or container component code which will catch all child component errors.




error

Application Error:{error.message}





import { LightningElement } from 'lwc';

export default class ErrorModule extends LightningElement {
error;
stack;
hasError;
errorCallback(error, stack) {
this.hasError=true;
this.error=error;
}
}

<?xml version="1.0" encoding="UTF-8"?>

48.0
true

lightningCommunity_Page
lightningCommunityDefault
lightningRecordPage
lightningAppPage
lightning_HomePage

You don’t have to use if:[true|false] in a template. For example, let’s say you define a single component template. If this component throws an error, the framework calls errorCallback and unmounts the component during rerender. https://www.quora.com/profile/Shailesh-Chaudhary-115

Top comments (0)