第一章—v-for

v-for指令

介绍：

可以用 v-for 指令基于一个数组来渲染一个列表。

以前没用到vue的时候我们拿到后台传过来的json数据，大都是用这种方法遍历渲染到页面的：

<div id="app"></div>
<script>
    $.ajax({
       type:'GET',
       data:{},
       dataType:'json',
       success:function(data){
            console.log(data);
            var table = "";
            for(i in data){
                '..................'
                '...................'
            }
          $("#app").html(table);
       }
    })
</script>

　　引号里面是一大推的样式和DOM节点，极容易出错，并且书写十分麻烦。

那么vue的列表渲染就很好的解决了这个问题,我们来看一下v-for是如何渲染出相同效果的，以官网实例为例：

这里面的items就可以当做后台接收过来的json数据，item可以随便命名，message就是json数据里面的各种名称，例如：

id,name,age...

然后通过item.message就可以将json数据全部遍历出来，并且各种样式也不用改变，是不是非常方便呢。

 

 

您的批评是对我最大的鼓励，欢迎指正。