#### 1. v-for 指令簡介 --- + v-for 指令基于一個(gè)數(shù)組來渲染一個(gè)列表。 + v-for 指令需要使用 `item in/of items` 形式的語法 + 其中 items 是源數(shù)據(jù)數(shù)組，item 是被迭代的數(shù)組元素別名 + 支持多種數(shù)據(jù)格式：`Array | Object | number | string | lterable(2.6新增)` #### 2. v-for 指令使用示例 --- ```html <li v-for="value in users">{{ value }}</li> ``` ```html <li v-for="value,index in users">{{ index }} => {{ value }}</li> ``` ```html <li v-for="(value,index) in users">{{ index }} => {{ value }}</li> ``` #### 3. v-for 指令的各種數(shù)據(jù)格式場景 --- **(1)、Array** ```html <p v-for="v,k in user">{{ k }} => {{ v }}</p> <p v-for="v,k in members">{{ v.name }} {{ v.age }}</p> data: { user: ['html', 'css', 'javascript'], members:[ { name: '張三', age: 20, }, { name: '李四', age: 25, }, ] } ```  **(2)、Object** ```html <p v-for="(v, k) in art">{{ k }} {{ v }}</p> data: { art: { title: '標(biāo)題', content: '內(nèi)容' }, } ```  **(3)、Number** ```html <ul> <li v-for="n in 10">{{ n }}</li> </ul> ```