Aura.Component[]

 

 

 

Aura.Component[ ]

type이 "Aura.Component[]"인  <aura:attribute> 이해하기

 

"Aura.Component[]"의 default value를 설정하기 위해, <aura:attribute>의 body에 default markup 지정

aurafacet.cmp

<aura:component>
    <aura:attribute name="MarkupDetail" type="Aura Component[]">
        <p>Aura Component[] default value<p>
    </aura:attribute>
</aura:component>

 

facet attribute (MarkupDetail)가 컴포넌트에서 설정되지 않은 경우 default markup이 적용됨

<aura:component>
    <c:aurafacet>
    	<!-- MarkupDetail attribute value를 지정하지 않았기 때문에 
             MarkupDetail attribute에 지정된 default body가 출력됨! -->
    <c:aurafacet>
</aura:component>

 

 

 

사용 예시

AuraComAttApp.app

<aura:application extends="force:slds">
    <c:AuraComAttUse />
</aura:application>

 

AuraComAtt.cmp

<aura:component>
    <aura:attribute name="RegionName" type="String" />
    <aura:attribute name="CountryList" type="Aura.Component[]">
    	<ol class="slds-list--ordered">
	    <li><b>US</b></li>
            <li><b>India</b></li>
        </ol>
    </aura:attribute>
    <div style="background-color:#FFFFFF; border-style:solid; height:100px; margin:auto;">
    	<p> {!v.RegionName} Countries List </p>
        {!v.CountryList}
    </div>
</aura:component>

 

AuraComAttUse

<aura:component>
    <aura:attribute name="APACCountryList" type="List"
    		    default="['India', 'Sri Lanka', 'Bangladesh']" />
    <aura:attribute name="EMEACountryList" type="List"
    		    default="['France', 'Germany']" />
                    
    <c:AuraComAtt RegionName="Default">
    	<!-- CountryList attribute value를 설정하지 않았기 때문에 AuraComAtt의 default body가 출력됨 -->
    </c:AuraComAtt>
    
    <c:AuraComAtt RegionName="APAC">
        <aura:set attribute="CountryList">
        	<ol class="slds-list--ordered">
                <aura:iteration items="{!v.APACCountryList}" var="country">
                	<li><b>{!country}</b></li>
                </aura:iteration>
            </ol>
        </aura:set>
    </c:AuraComAtt>
    
    <c:AuraComAtt RegionName="EMEA">
		<aura:set attribute="CountryList">
            <ol class="slds-list--ordered">
            	<aura iteration items="{!v.EMEACountryList}" var="country">
                	<li><b>{!country}</b></li>
                </aura:iteration>
            </ol>
        </aura:set>
    </c:AuraComAtt>
    
</aura:component>

 

↓

 

Output

 

 

정리

• Aura.Component[] 타입의 attribute value를 설정하지 않은 경우 Aura.Component[] 내에 지정된 default body를 출력함
• Aura.Component[]  타입의 attribute value를 설정하면 컴포넌트는 지정된 value를 기준으로 렌더링됨
• 다른 div는 그 안의 다른 content로 만들어지고 있음

 

 

 

 

 

 

 

 

출처 : www.sfdcstuff.com

Aura.Component[] : Lightning Framework Specific Attributes Type