DEV Community

shivamkapasia0
shivamkapasia0

Posted on

Lwc -> Apex : Salesforce

#salesforce #apex #javascript #beginners

# Call Apex Methods Imperatively

Call Apex Methods Imperatively is very simple :

1. Import Apex Method in js file like below format :

import apexMethodName from  '@salesforce/apex/Namespace.ApexClassName.MethodName';
Enter fullscreen mode Exit fullscreen mode

example :

import getAccountList from  '@salesforce/apex/AccountHelperClass.getAccountList';
Enter fullscreen mode Exit fullscreen mode

2. Call Apex Method as per your choice like below:
Here we are not passing any param to apex:

import { LightningElement, track } from  'lwc';
import getAccountList from  '@salesforce/apex/AccountHelperClass.getAccountList';
export  default  class  IterationComp  extends  LightningElement {
@track accountList = [];
@track error;
 loadAccountListData() {
 // here we are not sending any params to apex.
 // but if apex method requires params then,
 // we can pass like getAccountList({paramName : valueToPass})
 // instead of  getAccountList()
        getAccountList() 
            .then(result => {
                this.accountList= result;
            })
            .catch(error => {
                this.error = error;
            });
    }
}
Enter fullscreen mode Exit fullscreen mode

In above js code we have made a function loadAccountListData() inside this we are calling our apex method getAccountList from our Apex class AccountHelperClass and storing result in our accountList variable.

Imperative way basically uses promise to return the data and if any error occurs, it will be catch by our catch block.

We are calling our apex method in js function, so that we can reuse it by calling the this.loadAccountListData() function in any other js function. so we need to just call this.loadAccountListData to call the apex if we want to, or you can simple use getAccountList() function in other function.

  • Apex Class : In Imperative way, the cacheable=true is not required and thus it gives the ability to mutate the data inside apex method. But we can use it. 
public class AccountHelperClass {
    @AuraEnabled
    public static List<Account> getAccountList() {
        return [SELECT Id, Name FROM Account ];
    }
}
Enter fullscreen mode Exit fullscreen mode
  1. Passing params to apex : Suppose if apex require params to be passed like below apex method: 
public class AccountHelperClass {
    @AuraEnabled
    public static List<Account> getAccountList(String searchKey) {
        String key = '%' + searchKey + '%';
        return [
            SELECT Id, Name FROM Account WHERE Name LIKE :key WITH LIMIT 10
        ];
    }
}
Enter fullscreen mode Exit fullscreen mode

So our js code would become like below :

import { LightningElement, track } from  'lwc';
import getAccountList from  '@salesforce/apex/AccountHelperClass.getAccountList';
export  default  class  IterationComp  extends  LightningElement {
@track accountList = [];
@track error;
 loadAccountListData() {
 let key = 'shivam';
        getAccountList({searchKey : key}) 
            .then(result => {
                this.accountList= result;
            })
            .catch(error => {
                this.error = error;
            });
    }
}
Enter fullscreen mode Exit fullscreen mode

we can call loadAccountListData() function on onclick()in html or if you want to call apex when the components load you can simply call in connectedCallBack() function.

Calling Apex on Loading of Component :

To get data from apex whenever components load we can simply use connectedCallback() like below :

import { LightningElement, track } from  'lwc';
import getAccountList from  '@salesforce/apex/AccountHelperClass.getAccountList';
export  default  class  IterationComp  extends  LightningElement {
@track accountList = [];
@track error;

// it runs whenever components loaded into DOM
connectedCallback() { 
    this.loadAccountListData();
}

 loadAccountListData() {
 let key = 'shivam';
        getAccountList({searchKey : key}) 
            .then(result => {
                this.accountList= result;
            })
            .catch(error => {
                this.error = error;
            });
    }
}
Enter fullscreen mode Exit fullscreen mode

Keep following lwc series for upcoming blogs on lwc components,

Top comments (0)

Read next

preethi_p_gowda profile image

Future-Proofing Your Auth0 Integration: Moving from Rules and Hooks to Actions

Preethi Puttegowda -

tutortacademy profile image

Regrets Every Programmer Faces: Lessons for Aspiring Coders

Tutort Academy -

mikeyoung44 profile image

Extracting Sensitive Data via Remote Timing Attacks on Efficient Language Models

Mike Young -

mikeyoung44 profile image

Robust Interpretable Reasoning via Neurosymbolic Program Synthesis

Mike Young -