牛骨文教育服务平台(让学习变的简单)
博文笔记

vue v-for数组倒序

创建时间:2017-11-07 投稿人: 浏览次数:178
<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() 实现数组倒序排列

声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。