component.getReference vs component.get and $A.getReference vs $A.get

Can any one please explain difference between component.getReference vs component.get and $A.getReference vs $A.get. I have been through some blogs and code that guide through the basics.

I am new to lightning experience and components.

Answer

get returns an immediate value that you want to use right now, while getReference returns a value that will be updated in real time.

For example, if you want to fire an event, you use get, because you’ll be using it now, but if you want to register an event handler, you use getReference, because you’ll be using the reference later.

Similarly, if you need to know the value of an attribute right now, use get, but if you need to have that value updated automatically as it changes, you use getReference to get notified of any changes to the value later.

$A simply refers to the global Aura library. It’s used to get global events, attributes, and so on. component refers to the local component or application, and is used to refer to local attributes and events. If you’re not sure, you simply need to ask yourself “Is the value I’m looking for registered with the current component?” If yes, use component, and if not, use $A.

If you’re still not sure, check the documentation. Odds are, if the documentation refers to $A, you need to refer to $A, and if it refers to component, you need to as well.

Note that $A is a fixed value and will always exist anywhere in your code, including controllers, helpers, and renderers, while component is the simply the first parameter of some methods; if you want to choose a different name, like cmp, you’re free to do so.

The documentation always refers to the first parameter of methods that accept a component as component for consistency, but there’s nothing special about that name, and it’s not some sort of magic or global variable.


This simple application demonstrates the difference between get and getReference:

<aura:application >
    <aura:attribute name="valueA" type="String" default="Hey, Jude" />
    <aura:attribute name="valueB" type="String" />
    <aura:attribute name="valueC" type="String" />

    <aura:handler name="init" value="{!this}" action="{!c.init}" />

    <lightning:input name="reflect" value="{!v.valueA}" label="Current Value" />
    <lightning:input name="valuea" disabled="{!true}" value="{!v.valueA}" label="Value" />
    <lightning:input name="valueb" disabled="{!true}" value="{!v.valueB}" label="getReference" />
    <lightning:input name="valuec" disabled="{!true}" value="{!v.valueC}" label="get" />

</aura:application>

({
    init: function(component, event, helper) {
        component.set("v.valueB", component.getReference("v.valueA"));
        component.set("v.valueC", component.get("v.valueA"));
    }
})

In this code, we link valueB to a reference to valueA, but we only copy the current value of valueA in to valueC. As the user starts typing, you’ll see that valueB updates in real-time, but valueC does not. That’s the difference between get and getReference as a practical use case. You’d also typically want to do so if you dynamically create components and want to be notified, and for dynamically assigned event handlers.

Attribution
Source : Link , Question Author : Avijit , Answer Author : sfdcfox

Leave a Comment