vue에서 for문 사용하기

반복문을 사용할 때는  for문을 많이사용하고 있다.

특히 for문을 사용할때는 아래와 같은 방식을 주로 사용한다.

 

 

<[element 이름] v-for="(value, key) in [반복가능한 변수 이름]">

그리고  :key는 v-bind:key의 약어로 key로 사용할 변수를 적어주면 된다.

key를 사용할 떄 주의점은 pk처럼 중복이 되지 않게 사용하는 것이 좋으며, 애매하게 사용하는 것보다는 사용하지 않는 것이 더 낫다.

   <table class="basic_table" v-if="jsonData != null"> 
            <tr v-for="(item, index) in jsonData" :key="jsonData[index].id" >
               <td>{{item.title}}</td>
               <td>{{item.body}}</td>
            </tr>
   </table>