美文网首页
前端按多属性进行排序

前端按多属性进行排序

作者: 六月太阳花 | 来源:发表于2020-11-03 21:34 被阅读0次

一般排序工作都是又后端同学做的,但是偶尔后端资源紧张使也会由前端来完成,按照一种属性排序很简单,直接用一个sort方法就解决了。两个属性的时候也可以用嵌套的实现,但是多个属性的呢?
那就要用到递归啦,下边是多使多属性排序的,根据不同的需求可以通过改变fields来实现。

/*
arr:需要进行排序的数组
fields:说明按照数组的哪一项进行排序
*/
  objectSort:function(arr, fields) {
    let checkOrder = (left, right, fields) => {
        let field = fields.shift()
        if (field === undefined) return 0;
        if(field.method == 'asc' && field.type == 'zh'){
          return left[field.key].localeCompare(right[field.key], 'zh-CN')
        }else if(field.method == 'asc'){//升序
          return left[field.key] === right[field.key] ? checkOrder(left, right, fields) : (left[field.key] < right[field.key] ? -1 : 1)
        }else if(field.method == 'des'){
          return left[field.key] === right[field.key] ? checkOrder(left, right, fields) : (left[field.key] > right[field.key] ? -1 : 1)
        }
        
    }
    return arr.sort((left, right) => {
        return checkOrder(left, right, JSON.parse(JSON.stringify(fields)))
    })
},
//调用
 let orderType = [{
        key:'correct_count',//按照哪个字段进行排序
        method:'des'            //标明按照什么方法
      },{
        key:'spent',
        method:'asc'
      },{
        key:'created_at',
        method:'asc'
      },{
        key:'student_name',
        type:'zh', //中文首字母排序
        method:'asc'
      }
    ]
objectSort(list,orderType)

相关文章

网友评论

      本文标题:前端按多属性进行排序

      本文链接:https://www.haomeiwen.com/subject/czdmvktx.html