Aura root component not handling the application event started from its child (Lightning Component)

1k views Asked by At

Aura application event is firing successfully but it seems that the handler component is failing to listen or handle it and it does not call the action method openFeed. This is the component that handle the application event.

    <aura:component controller="ConnectApiCallsController">
    <aura:attribute name="yourfeed" type="PortalFeedWrapper[]" access="public"/>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" /> 

    <aura:handler event="c:DraggableNavEvent" action="{!c.openFeed}" />
    <aura:handler event="aura:doneRendering" action="{!c.doneRendering}" /> // not working if removing this line

    <div> 
        <div class="feedWrapper slds-scrollable" > 
            <div class="tab">
                <c:HorizontalDraggableNav/> 
            </div>

            <div id="yourFeedTab" class="tabcontent"> 
                <c:YourFeedWrapper feeds="{!v.yourfeed}"/> 
            </div>

            <div id="discussionsByTopicsTab" class="tabcontent">
                <c:DiscussionsByTopicsWrapper />
            </div>

            <!-- PrivateFeeds By THiru-->  
            <div id="privateFeedTab" class="tabcontent">  
                <c:PrivateFeedWrapper isUserInternal="{!v.isInternalUser}"/>   
            </div>
        </div>
    </div>
</aura:component>

When I remove doneRendering from the component than the openFeed is being called just fine, but the thing is why does doneRendering needs to be there for it to work? I dont have any doneRendering method declared on the controller. What am I doing wrong that doneRendering needs to stay there in order for it to work? Also that this is the parent component while the component that fires the application event is is c:HorizontalDraggableNav by using the following code:

var appEvent = $A.get("e.c:DraggableNavEvent");
appEvent.setParams({ feedType: e.target.id });
appEvent.fire();

and the component looks as below:

<aura:component>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:handler name="render" value="{!this}" action="{!c.onRender}" />
    <aura:attribute name="isLoginUserInternal" type="Boolean" default="false" /> <!-- PrivateFeeds By Thiru--> 
    <aura:registerEvent name="appEvent" type="c:DraggableNavEvent" />

    <div class="grid-container">
        <div class="grid-item main">
            <div class="items" id="items">
                <div class="item" id="yourFeed">Your feed</div>
                <div class="item" id="discussionsByTopics">Discussions by topics</div> 

                <!-- PrivateFeeds By Thiru--> 
                <aura:if isTrue="{!v.isLoginUserInternal}">
                    <div class="item" id="privateFeed">Valmet internal</div> 
                </aura:if>

            </div>
        </div>
    </div>
</aura:component>

Any idea or solution on this problem?

1

There are 1 answers

0
TemporaryFix On

This might be because you're using the aura:doneRendering event.

That event has been deprecated and the documentation says using it may impact other events.

Unless your component is running in complete isolation in a standalone app and not included in complex apps, such as Lightning Experience or the Salesforce mobile app, the container app may trigger your event handler multiple times. This behavior makes it difficult to handle each event appropriately.