Created
August 12, 2018 09:34
-
-
Save Sunil02kumar/70c1c771c17c719de455226519d5716d to your computer and use it in GitHub Desktop.
Component Events: Way to Communicate Between Components in Containment Hierarchy
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<aura:component > | |
<aura:attribute name="childValue" type="string" default="Child"/> | |
<aura:registerEvent name="changeValueEvent" type="c:SK_LightningEventChannel"/> | |
<lightning:button name="ddff" label="Fire event" onclick="{!c.fireEvent}"/> | |
</aura:component> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
({ | |
fireEvent : function(component, event, helper) { | |
console.log('********firing event'); | |
var newEvent = component.getEvent("changeValueEvent"); | |
newEvent.setParams({"passedValue":"twitter handle-@sunil02kumar"}); | |
newEvent.fire(); | |
} | |
}) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<aura:application extends="force:slds"> | |
<c:SK_MasterCmp/> | |
</aura:application> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<aura:event type="COMPONENT" description="Event template" > | |
<aura:attribute name="passedValue" type="string"/> | |
</aura:event> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<aura:component > | |
<!--name should be equal to name while register event--> | |
<aura:handler name="changeValueEvent" event="c:SK_LightningEventChannel" | |
action="{!c.handleNotification}"/> | |
<aura:attribute name="mastervalue" type="string" default=""/> | |
<div style="background-color:#E6E6FA;border-style: solid;height:200px;margin:5%;padding:2%;"> | |
<p>This is master Component- container for c:SK_ChildCmp</p> | |
<br/> | |
Display value passed from child component using component events---<b>{!v.mastervalue}</b> | |
<br/> | |
<div style="background-color:grey;border-style: solid;padding:2%;"> | |
<p>This is child component present inside c:MasterCmp</p> | |
<c:SK_ChildCmp/> | |
</div> | |
</div> | |
</aura:component> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
({ | |
handleNotification : function(component, event, helper){ | |
console.log('****handling event'); | |
var sentMessage= event.getParam("passedValue"); | |
component.set("v.mastervalue", sentMessage); | |
} | |
}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment