Today we will discuss how can we call apex class or apex method in LWC Salesforce. To call the apex method first we need to import a wire decorator. We also pass the parameter in Carli bracket ‘{ }’. Do remember one thing LWC is case-sensitive so the parameter name will be the same that you defined in the apex class.
Also, check this: Lightning Message Service (LMS) in LWC
call apex class or apex method in LWC Salesforce
Import wire decorator :
import { LightningElement, wire} from 'lwc';
Import Apex Method: To call the apex method we need to import the apex method.
import apexMethodName from '@salesforce/apex/Namespace.Classname.apexMethodReference';
There are 3 main ways we can do this.
- Wire a property
- Wire a function
- Call a method imperatively
1. Wire a property: if an apex method is annotated with @AuraEnabled(cacheable=true), you can call the method from the js file in LWC.
@wire(apexMethod, { apexMethodParams })
functionname;
Example: apexWireMethodProperty.js
import { LightningElement, wire } from 'lwc';
import getConatct from '@salesforce/apex/ContactController.getContact';
export default class ApexWireMethodToProperty extends LightningElement {
@api recordId;
@wire(getContact, {recordId : '$recordId'})
getContact;
}
ContactController.cls :
public with sharing class ContactController {
@AuraEnabled(cacheable=true)
public static Contact getContact(Id recordId) {
return [SELECT Id, Name, Title, Phone, Email FROM Contact WHERE Id =:recordId];
}
}
2. Wire a function: In this wire function, we get results in the wire function. the result will be in data and error. if any error is found you can get it. it can write 2 ways according you want to use refreshApex or not.
example1.js: In this way, we can’t use apex refresh, cache not refresh
import { LightningElement, wire } from 'lwc';
import getConatct from '@salesforce/apex/ContactController.getContact';
export default class example1 extends LightningElement {
data;
error;
@api recordId;
@wire(getContact, {recordId : '$recordId'})
wiredContacts({ error, data }) {
if (data) {
this.data = data;
this.error = undefined;
} else if (error) {
this.error = error;
this.data = undefined;
}
}
}
example2.js: In this way, we can refresh the result because we need to a variable which has the full result of wire so
import { LightningElement, wire } from 'lwc';
import getConatct from '@salesforce/apex/ContactController.getContact';
import { refreshApex } from '@salesforce/apex';
export default class example2 extends LightningElement {
data;
error;
wireResult;
@api recordId;
@wire(getContact, {recordId : '$recordId'})
wiredContacts(result) {
this.wireResult = result;
if (result.data) {
this.data = result.data;
console.log(this.data);
this.error = undefined;
} else if (result.error) {
this.error = result.error;
this.data = undefined;
}
}
refreshData(event){
refreshApex(this.wireResult);
}
}
3. Call a method imperatively: If you want to call an apex method that is not annotated by cacheable=true, you can still call it imperatively.
imperativelyExample.Js
import { LightningElement} from 'lwc';
import getContact from '@salesforce/apex/ContactController.getContact';
export default class ImperativelyExample extends LightningElement {
data;
error;
@api recordId;
handleLoad() {
getContact({recordId : this.recordId})
.then(result => {
this.data = result;
})
.catch(error => {
this.error = error;
});
}
}
Total views : 956036