0

I have a parent component "P" created dynamically on the load of a visualforce page. One child component "C" is referred inside the parent. Some actions are fired on the load of both parent and child components, individually through their doInit functions. So, the sequence is

  1. Parent component loads
  2. Child component loads
  3. Parent's doInit is called
  4. Child's doInit is called
  5. Page is rendered successfully only when bothe the doInit calling is completed.

However, the details displayed on the child component can be delayed in displaying. Any suggestions to achieve this ?

0

Your understanding appears to be incorrect. Assuming C is defined in markup in P, then C's doInit will be called before P's doInit. If you want to force P to go first, you can add an extra render cycle with aura:if:

<aura:attribute name="showChild" type="Boolean" default="false" />
...
<aura:if isTrue="{!v.showChild}">
  <c:C />
</aura:if>

However, you'll also want to make sure there's a delay so the rendering can catch up. The parent's doInit should look like:

doInit: function(component, event, helper) {
  helper.initialize(component); // Do any logic for P.
  setTimeout(
    $A.getCallback(
      function() {
        component.set("v.showChild", true);
      }
    )
  );
}

The delay caused by setTimeout will allow a render cycle to complete and P's content will be displayed before C is ready.

1
  • Thanks @Sfdcfox. I am now modifying the render cycle – Arun Kumar Aug 24 '20 at 12:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.