vue 数组对象的某一属性值排序（升降序）

vue 数组对象的某一属性值排序（升降序）

效果如下：

代码如下

<view class="nav-item r-box" @click="tabClick">
	<text>价格</text>
	<view class="a-box">
		<u-icon name="arrow-up-fill"  class="yticon" :class="{active: priceOrder === 2}" size="10"></u-icon>
		<u-icon name="arrow-down-fill"  class="yticon" :class="{active: priceOrder === 1}" size="10"></u-icon>
	</view>
</view>



data() {
	return {
		priceOrder: 0,
		myArr:[{name: '小红',num: 3},{name: '小蓝',num: 5},{name: '小黄',num:4}]
	}
}


mysort1(i) {   //  a[i] - b[i]为正序，倒叙为  b[i] - a[i] 
    return function(a,b) {
       return b[i] - a[i] 
     }
},
mysort2(i) {
     return function(a,b) { //  a[i] - b[i]为正序，倒叙为  b[i] - a[i] 
       return a[i] - b[i] 
     }
},
//价格排序切换
tabClick() {
	this.priceOrder = this.priceOrder === 1 ? 2: 1;
	if(this.priceOrder === 1) {
		this.myArr = this.myArr.sort(this.mysort1("num"))
		//[{name: '小蓝',num: 5},{name: '小黄',num:4},{name: '小红',num: 3}]
	}else {
		this.myArr.sort(this.mysort2("num"))
		//[{name: '小红',num: 3}{name: '小黄',num:4}，{name: '小蓝',num: 5}]
	}
},



css:
.active {
	color: black;
}