Hello friends , today we will learn how to show custom error message or proper way of get error message in catch block in Lightning web component. Many times you get error but it’s not going in catch block because we return as a string or object and we do some custom code in try block to show error.
To use Aurahandledexception we easily throw an error instance of it from within Apex. By this way we also supply custom error also And this custom error goes to lightning web component method catch block , where we show proper error toast message
Lets Understand with simple example :
AuraExceptionTechdicerLWC.html :
<template>
<div class="slds-tabs_card">
<div class="slds-page-header">
<div class="slds-page-header__row">
<div class="slds-page-header__col-title">
<div class="slds-media">
<div class="slds-media__figure">
<span class="slds-icon_container slds-icon-standard-opportunity">
<lightning-icon icon-name="standard:recipe" alternative-text="recipe" title="recipe"></lightning-icon>
</span>
</div>
<div class="slds-media__body">
<div class="slds-page-header__name">
<div class="slds-page-header__name-title">
<h1>
<span>Show Exception in LWC</span>
<span class="slds-page-header__title slds-truncate" title="Recently Viewed">TechDicer</span>
</h1>
</div>
</div>
</div>
</div>
</div>
<div class="slds-page-header__col-actions">
<div class="slds-page-header__controls">
<div class="slds-page-header__control">
<ul class="slds-button-group-list">
<li>
<lightning-button name="ShowException" label="Show Exception" onclick={showException} variant="brand"
class="slds-m-around_small"></lightning-button>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
AuraExceptionTechdicerLWC.JS :
import {LightningElement} from 'lwc';
//Import our Apex method
import updateContact from "@salesforce/apex/AuraExceptionTechdicer.updateContact";
//Only import this if you want to show your error as a Toast message
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
export default class AuraExceptionTechdicerLWC extends LightningElement {
showException(){
updateContact().then({
//do something
})
.catch((error) => {
//Let's send the user a toast with our custom error message
const evt = new ShowToastEvent({
title: "Yikes!",
message: error.body.message,
variant: "error",
});
this.dispatchEvent(evt);
})
}
}
AuraExceptionTechdicer.cls :
public class AuraExceptionTechdicer {
@AuraEnabled
public static void updateContact() {
try {
Contact con = [SELECT Id, LastName FROM Contact LIMIT 1];
//Set Contact Last Name to null to trigger an exception
con.LastName = null;
update con;
} catch (Exception e) {
//Add your custom error messsage to the AuraHandledException, you can add any string here
throw newMessageException('It seems we can\'t update your Contact right now | Error : ' + e.getMessage());
}
}
private static AuraHandledException newMessageException(String message) {
AuraHandledException e = new AuraHandledException(message);
e.setMessage(message);
return e;
}
}
What’s your Reaction?
+1
1
+1
1
+1
+1
+1
1
+1
2
Total views : 1113167