Call Apex class in LWC Salesforce

by Rijwan Mohmmed
0 comment
call-apex-class-in-lwc-salesforce-techdicer

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.

  1. Wire a property
  2. Wire a function
  3. 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;
            });
    }
}

Resource :

  1. LWC Apex

You may also like

Leave a Comment