vue 반응성 과 조건문/반복문, 외부 생성 vue import하기

vue의 구조

vue에서 style에 scss문법으로 작성선언

디렉티브 click 

h1을 click시 count+가 되는 increase함수가 작동됨

디렉티브 If : count가 4보다클시 div가 나타난다.

  <div v-if="count >4 ">

    4보다큽니다!

  </div>

 

디렉티브 for : fruits배열안에 들어있는 요소들을 하나씩 fruit에 교체하며 아래에서 {{ fruit }}로 나타낸다.

<ul>

    <li

      v-for="fruit in fruits"

      :key="fruit">

      {{ fruit }}

    </li>

  </ul>

 

외부 Fruit.vue를 만들어 메인 App.vue로 import하기