vue學習筆記3 v-for加排序

items是一個數組

<li v-for="(student,index) in sortStudent">{{index}}姓名：{{student.name}} 年齡：{{student.age}}</li>

再加一個排序

需要用到 computed:{

sortitems:function(){

return this.items.sort()

}

}

注意 computed 要新聲明一個對象sortitems，這時要寫成 item in sortitems

 

升序  function sortNum(a,b){return a-b}

 

降序  function sortNum(a,b){return b-a}

 

在sortitems 調用排序函數：this.item.sort(sortNum)

 

排序對象

function (arr,key){

arr.sort(function(){

let x=a[key]

let y=b[key]

return ((x<y)?-1:(x>y)?1:0)

})

}

 

var app = new Vue({
                el:'#app',
                data:{
                    items:[12,7,160,88,5,96,66,20],
                    students:[
                        {name:'seodream',age:20},
                        {name:'hyaov5',age:25},
                        {name:'laohan',age:33}
                    ]
                },
                computed:{
                    sortitems:function(){
                        return this.items.sort(sortNum)
                    },
                    sortStudent:function(){
                        return sortByKey(this.students,'age')
                    }
                }
            })