Learning Salesforce Lightning Application Development

Alternate syntax to handle events raised by child components

There is an alternate syntax to handle an event raised by a child component in a parent component. Let's take a look at the syntax:

<!-- parent.cmp --><aura:component> <c:child sampleComponentEvent="{!c.handleChildEvent}"/></aura:component>

In this case, the child component has registered and fired an event named sampleComponentEvent. Notice that in the parent component, we used an attribute name the same as that of the event name registered by the child component. This is a shorthand notation of the following syntax:

<!-- parent.cmp --><aura:component> <aura:handler name="sampleComponentEvent" event="c:compEvent"  action="{!c.handleSampleEvent}"/> <c:child /></aura:component>