Use aura:method
to define a method as part of a component’s API. This enables you to directly call a method in a component’s client-side controller instead of firing and handling a component event. Using aura:method
simplifies the code needed for a parent component to call a method on a child component that it contains.
Child Component:
<!--Child.cmp--> <aura:component > <aura:method name="messageMethod" action="{!c.getMessage}" access="public"> <aura:attribute name="param1" type="String" default="Hello"/> <aura:attribute name="param2" type="String" default="World"/> </aura:method> </aura:component>
Child Component JS Controller:
({ getMessage : function(component, event) { //get method paramaters var params = event.getParam('arguments'); if (params) { var param1 = params.param1; var param2 = params.param2; alert(param1 + " " + param2); } } })
Parent Component:
<!--Parent.cmp--> <aura:component> <div class="slds-m-around_xx-large"> <!-- Child Component --> <c:Child aura:id="childCmp"/> <!-- On button click child aura:method will be called--> <lightning:button variant="brand" label="Call Aura Method" onclick="{!c.callAuraMethod}" /> </div> </aura:component>
Parent Component JS Controller:
({ callAuraMethod : function(component, event, helper) { //Call Child aura method var childComponent = component.find("childCmp"); var message = childComponent.messageMethod(); } })