vue v-for 降序循环反循环

1.第一种方法,直接在v-for里面写:

<view v-for="(item,index) in array.slice().reverse()" :key="index">{{item.name}}</view>

2.第二种方法:利用计算属性

<div class="list" v-for="(item,index) in reverseSum">
	<ul >
		<li>{{item.id}}</li>
		<li>{{item.sumtime}}</li>
		<li>{{item.week}}</li>
		<li>{{item.grasp}}</li>
	</ul>
</div>



computed: {
        reverseSum() {
            return this.allSum.reverse();
        }
},

记录一下数组的有关操作方法:

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

push()         数组末尾添加

pop()           数组末尾取出

shift()          数组开头取出

unshift()      数组开头添加

splice()        删除并插入

sort()           排序

reverse()     数组顺序颠倒
Posted in VUE

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注