# v-for指令
## 用 v-for 把一個數組對應為一組元素
我們用 `v-for` 指令根據一組數組的選項列表進行渲染。`v-for` 指令需要使用 `item in items` 形式的特殊語法，`items` 是源數據數組并且 `item` 是數組元素迭代的別名。
如果希望使用索引值那么提供了`(item,index) in items`第一項為數組元素的別名，第二項為索引值，不可以交換位置
```html
<div id="app">
<ul>
<li v-for="(people,index) in peoples">{{ index }}------ {{ people }}</li>
</ul>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
peoples: ['小李', '小張', '小秦'],
}
})
</script>
```
## 一個對象的 v-for
你也可以用 v-for 通過一個對象的屬性來迭代。
**`value`,`key`,`index` 第一個是對應的值，第二個是屬性名稱，第三個是索引。**
注意這里面的渲染的結果并不一定會按照對象的屬性先后顯示。
```
<div id="app">
<p v-for="(value,key,index) in people">
{{key}}---{{value}}
</p>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
people: {
name: "小李",
age: 18,
sex: "男"
}
}
})
</script>
```
```
0--name---小李
1--age---18
2--sex---男
```
