[Vue] V-for 반복문 사용하기

기본문법

<div>
	<a v-for="작명 in 반복횟수" :key="작명"></a>
</div>

원하는 태그에 v-for="작명 in 반복할횟수" 를 적고 key값을 지정해준다.

v-for 반복문은 사용할 때 array, object데이터를 집어넣을 수도 있다.

예제)

<div>
	<a v-for="작명 in 반복횟수" :key="작명">{{작명}}</a>
</div>


data(){
	return {
    	메뉴들: ['home', 'shop', 'about']
        }
  	}
    

이렇다고 가정하면 메뉴들이 배열만큼 반복문을 돌기 시작하고 자료 갯수만큼 반복이된다.

v-for은 변수를 2개까지 작명이 가능하다.

<div>
	<a v-for="(작명,i) in 메뉴들" :key="i> {{작명}} </a>
</div>

소괄호안에 작명이 두개까지 가능한데

첫째는 array안의 데이터가 되고

둘째는 0,1,2.. 이런식으로 1씩 증가하는 정수가 된다.

반복 횟수를 알려주는 숫자이다.