Vue.jsでObjectをv-forでを利用する

配列の場合は以下のようになる（公式より）

<ul id="example-1">
  <li v-for="item in items">
    {{ item.message }}
  </li>
</ul>

var example1 = new Vue({
  el: '#example-1',
  data: {
    items: [
      { message: 'Foo' },
      { message: 'Bar' }
    ]
  }
})

結果：

• Foo
• Bar 　 　 　 Objectの場合は v-forの左辺に入る値に valueとkeyを入れる（順番注意）

<ul id="example-1">
  <li v-for="(value, key) in item">
    {{ key }} is {{ value }}
  </li>
</ul>

var example1 = new Vue({
  el: '#example-1',
  data: {
    items: { hoge: 'Hoge', foo: 'Foo' }
  }
})

結果：

• hoge is Hoge
• foo is Foo

indexも取得したい場合は３番目に入れる

<ul id="example-1">
  <li v-for="(value, key, index) in item :key='index'">
    {{ key }} is {{ value }}
  </li>
</ul>