How to implement loading sign in lightning component salesforce

Updated 14 October 2025

In this blog we will learn how to implement loading sign in lightning component. You can refer to the code below:

 

Loading sign in lightning component

Here is the code :

Component –

<aura:component access="global">
        <ui:spinner aura:id="spinner"/>
        <ui:button press="{!c.toggleSpinner}" label="Toggle Spinner" />
</aura:component>

Controller –

({
    toggleSpinner: function(cmp) {
        var spinner = cmp.find('spinner');
        var evt = spinner.get("e.toggle");
        
	if(!$A.util.hasClass(spinner, 'hideEl')){
	    evt.setParams({ isVisible : false });
	}else {
	    evt.setParams({ isVisible : true });
	}
        evt.fire();
    }
})

Output

Here is the output –

loading sign in lightning component

Support

That’s all for how to implement load sign in lightning component, still have any issue feel free to add a ticket and let us know your views to make the code better https://webkul.uvdesk.com/en/customer/create-ticket/

 

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

Welcome back

Welcome back! Please enter your details

One or more fields have an error. Please check and try again.


Forgot Password?

Tell us about Your Company

How can we help you with your business?