Vue 列表渲染

摘要：列表渲染用把一个数组对应为一组元素我们用指令根据一组数组的选项列表进行渲染。你也可以用替代作为分隔符把对象属性渲染列表你也可以提供第二个的参数为键名第三个参数为索引渲染组件列表自定义组件里，你可以像任何普通元素一样用。

我们用 v-for 指令根据一组数组的选项列表进行渲染。 v-for 指令需要以 item in items 形式的特殊语法， items 是源数据数组并且 item 是数组元素迭代的别名。

 
{{item.text}}{{wenben}}

 data:{

 items:[
    {text:"chifan",isOk:true},
    {text:"shuijue",isOk:false},
    {text:"kandianshi",isOk:true},
    {text:"dayouxi",isOk:true},
    {text:"kandianying",isOk:false},
 ]                   
 }    

在 v-for 块中，我们拥有对父作用域属性的完全访问权限。 v-for 还支持一个可选的第二个参数为当前项的索引。

 
{{index}}{{item.text}}{{wenben}}
  

    
 {{value}}
               

      

你也可以提供第二个的参数为键名：

    
{{key}} is {{value}}
               

  

第三个参数为索引：

    
{{index}}{{key}} is {{value}}
               

  

自定义组件里，你可以像任何普通元素一样用 v-for 。

2.2.0+ 的版本里，当在组件中使用 v-for 时，key 现在是必须的。

v-for 也可以取整数。在这种情况下，它将重复多次模板。

{{ n }}