33
Diego Ferreiro VAL

Q&A with Lightning Components Experts (June 4, 2015)

Embed Size (px)

Citation preview

Diego Ferreiro VAL

<aura:component extensible="true" support="GA" description="A test component">

<aura:attribute name="title" type="String" description="A title" default="Title!"/>

<aura:attribute name="facet" type="Aura.Component[]" description="A facet Component"/>

<aura:attribute name="truthy" type="Boolean" description="A boolean attribute"/>

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

<p>My component: <span>{!v.title}</span></p>

<aura:if isTrue="{!v.truthy}">

{!v.facet}

<aura:set attribute="else">

<myNS:foo broza="{! v.title + "Yay!" }">

</aura:set>

</aura:if>

</aura:component>

<!-- helloWorld.cmp -->

<aura:component>

Hello World!

</aura:component>

<ns:helloWorld/>

<!-- helloWorld.cmp -->

<aura:component>

Hello World!

{!v.body}

</aura:component>

<ns:helloWorld>

How are you doing?

</ns:helloWorld>

<aura:component>

<aura:attribute name="text" type="String" description=""/>

{!v.text}

</aura:component>

<ns:myCmp text="MyText"/>

{!v.foo}

{!"bar" + v.foo}

{!v.truthy == null}

{!empty(v.foo)}

{!15 < v.count < 25}

{!v.foo ? "yes" : "no"}

{!and(v.ua.phone eq 'iOS', v.ua.version eq '8.1')}

{!v}

{!c}

{!m}

{!e}

{!your_own}

{!$Label}

{!$Browser}

!{$Your_own}

{!v.foo}

{#v.foo}

item = {!v.bigObject.item}

subitem = {!v.item.sub}

thing = {!v.bigObject.item}

subthing = {!v.thing.t}

cmp.set("v.subitem","blah");

{#value}

{!binding}

AURA #PERF TIP!

<aura:component description="Test if">

<aura:if isTrue="{!v.truthy}">

YES?

<aura:set attribute="else">

NO?

</aura:set>

</aura:if>

</aura:component>

<aura:component description="Test if">

<aura:renderIf isTrue="{!v.truthy}">

YES?

<aura:set attribute="else">

NO?

</aura:set>

</aura:renderIf>

</aura:component>

DEPRECATED

AURA #PERF TIP!

1

2

3

45

6

new Component()

1

2

3

45

6

rendered.render()

setTimeout()

afterRender: function (cmp, helper) { this.superAfterRender(); $A.get("e.myns:mycmp").fire();}

{!v.my.very.long.expression.that.makes.performance.quite.sad}