0. HTML도 당연히 반복문이 있지

<div>
	<a>menu1</a>
	<a>menu2</a>
	<a>menu3</a>
</div>

같은 코드를 보면 반복문이 필요하다는 생각이 든다.
vue에서는 위의 코드를 반복문v-for="" 사용으로 아래의 코드처럼 단축시킬 수 있다.

<template>
  <a v-for="i in products" :key="i"> {{i}} </a>
</template>

<script>
export default {
  name: 'App',
  data(){
    return {  
      products : ['menu1', 'menu2', 'menu3']
    }
  },
  components: {
  }
}
</script>

---

1. 문법

<div>
	<a v-for="작명 in ??" :key="작명"></a>
</div>

• 이때 "" 안에는 조건이 들어가면 문법은 파이썬 for문에 :key="i"가 추가된 모양이다.
• 작명은 2개까지 가능하며 파이썬 반복문의 i라고 생각하면 된다

1.2 좀 더 보자

  <div v-for="(i, j) in products" :key="i">
    <h4>{{i}}</h4>
    <p>{{어레이[j]}}</p>
  </div>

• (value, index)

---

참고

• 코딩애플