<div id="app">  
    <ul>  
        <template v-for="i in items">  
            <li>Index is {{$index}}</li>  
            <li>Content is {{i}}</li>  
        </template>  
    </ul>  
</div>  
<script>  
    var vm = new Vue({  
        el: '#app',  
        data: {  
            items: {  
                a: "1",  
                b: "2",  
                c: "3"  
            }  
        }  
    })  
</script>  

④监视数组变动（修改数组）

 

当data的某个属性是一个数组时，用v-for可以遍历，但显然数组是可能变动的，因此对以下变动也进行数据绑定；

push()         数组末尾添加

pop()           数组末尾取出

shift()          数组开头取出

unshift()      数组开头添加

splice()        删除并插入

sort()           排序

reverse()     数组顺序颠倒

当利用以上方法变更数组时，被渲染的内容会实时更新；

采用reverse() 实现数组倒序排列