aura 기본 컴포넌트 구성 Create and Edit Aura Components

 

<트레일헤드 문제 >

Create a simple camping list component

Create a camping component that displays a list of camping supplies that you need for your trip. Increase reusability by using other components to compose this component.

• Create a campingList component that contains an ordered list of camping supplies that include Bug Spray, Bear Repellant, and Goat Food
• Create a campingHeader component that displays Camping List wrapped in an H1 tag with a font size of 18
• Create a camping component that contains the campingHeader and campingList components

우선,

헤더 , 캠페인 리스트 구성 으로 분리시켜놔야함

헤더는 font-size 가 18px이 되어야하므로 css 에서 설정을 해줌 

 

1.camping.cmp

 

<aura:component >
    <c:campingHeader/>
    <c:campingList/>
</aura:component>

 

2. campingHeader.cmp

 

<aura:component >
<h1>Camping List</h1>
</aura:component>

 

3.campingList .cmp

 

<aura:component >
<ol>
     <li>Bug Spray</li>
        <li>Bear Repellant</li>
        <li>Goat Food</li>
    </ol>
</aura:component>

 

4.camping.css 

.THIS {
}
p.THIS{
    font-size:18px;
}

 

가 답이 됨