Aura.Component[] : Lightning Framework Specific Attributes Type

We know that there are different attribute types supported for attribute in lightning like Boolean, date, datetime, decimal, double, integer, long, string, collections (list,set,map), sobjects, user defined data types(wrapper class) etc.

Below are 2 different types which are supported as attribute type and specific to lightning framework:

• Aura.Component[]
• Aura.Action

In this blog, we are going cover all aspect of Aura.Component[] attribute type. If you are interested in learning more about Aura.Action, then refer below blog:

Aura.Action : Lightning Framework Specific Attributes Type

Aura.Component[]

An attribute of this type is considered as facet. You can use this in order to set markup to use it in multiple places.

You can consider it some what similar to defining templates with <apex:composition> in VF pages.

To set a default value for "Aura.Component[]", specify the default markup in the body of aura:attribute. For example:

<!--aurafacet.cmp-->

<aura:component>

<aura:attribute name="MarkupDetail" type="Aura.Component[]">

<p>Aura.Component[] default value</p>

</aura:attribute>

</aura:component>

So when this facet attribute(MarkupDetail) value is not set in component, then this default mark up will apear.

<aura:component>

    <c:aurafacet >        

        <!--we are not setting MarkupDetail attribute value so this will display 

default body specified in MarkupDetail attribute--> 

    </c:aurafacet>

</aura:component>

Output will be:

Aura.Component[] default value

Below is sample code which include different components and usage of Aura.Component[] in it. Also it will explain how to reuse the component body.

Below is output snapshot:

Points to be noted:

• When we didn't set the attribute value of type Aura.Component[], then it display default body specified within Aura.Component[].
• When we set attribute value of type Aura.Component[], component will render based on given values.
• Different div are being getting created with different content in that.

Hope this helps!!!