List 생성하기

HTML

<div id="app">
  <ul>
    <li v-for="n in 3" v-text="n"></li>
  </ul>
  
  <ul>
    <li v-for="n in [10, 11, 13]" :key="n" v-text="n"></li>
  </ul>
  
  <ul>
    <li v-for="(n, index) in countdown" v-text="n + ' ' + index"></li>
  </ul>
  
  <ul>
    <li v-for="(value, key) in animals" v-text="key + ': ' + value"></li>
  </ul>
</div>

Vue

new Vue({
	el: '#app',
  data: {
  	countdown: ['one', 'two', 'three'],
    animals: {
    	dog: 'woof', cat: 'meow', bird: 'tweet',
    }
  }
});

// Loop는 1부터 시작.

// [Error] 책에서는 리터럴 배열이 안된다고 했는데 실제로 해보니 됨.

// [TIP] 객체의 속성이 열거되는 순거는 고정되지 않는다고 한다.