aura:doneRendering

Indicates that the initial rendering of the root application has completed.
Note

Note

We don't recommend using the legacy aura:doneRendering event except as a last resort. Unless your component is running in complete isolation in a standalone app and not included in complex apps, such as Lightning Experience or Salesforce1, you probably don’t want to handle this application event. The container app may trigger your event handler multiple times.

This event is automatically fired if no more components need to be rendered or rerendered due to any attribute value changes. The aura:doneRendering event is handled by a client-side controller. A component can have only one <aura:handler> tag to handle this event.
<aura:handler event="aura:doneRendering" action="{!c.doneRendering}"/>
For example, you want to customize the behavior of your app after it’s finished rendering the first time but not after subsequent rerenderings. Create an attribute to determine if it’s the first rendering.
<aura:component>
    <aura:handler event="aura:doneRendering" action="{!c.doneRendering}"/>
    <aura:attribute name="isDoneRendering" type="Boolean" default="false"/>
    <!-- Other component markup here -->
    <p>My component</p>
</aura:component>
This client-side controller checks that the aura:doneRendering event has been fired only once.
({
  doneRendering: function(cmp, event, helper) {
    if(!cmp.get("v.isDoneRendering")){
      cmp.set("v.isDoneRendering", true);
      //do something after component is first rendered
    }
  }
})
Note

Note

When aura:doneRendering is fired, component.isRendered() returns true. To check if your element is visible in the DOM, use utilities such as component.getElement(), component.hasClass(), or element.style.display.

The aura:doneRendering handler contains these required attributes.
Attribute Name Type Description
event String The name of the event, which must be set to aura:doneRendering.
action Object The client-side controller action that handles the event.