最近做的项目上有一个排序功能
图片.png
以前就很少用js的sort，正好可以补补了
先说说sort方法
直接用 arr.sort()是按照ASCII码排序 大家可以看看文档
他还可以加参数 来自定义排序
<script type="text/javascript">
function sortNumber(a,b)
{
return a - b
}
var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"
document.write(arr + "<br />")
document.write(arr.sort(sortNumber))
</script>
通过方法的返回值来判断两个数的位置关系
结果
10,5,40,25,1000,1
1,5,10,25,40,1000
所以这个排序的步骤大致是这样
1.获得点击对象，交换位置的对象
2.得到对象的seq，然后交换
3.调用自定义sort方法排序，重新赋值给this.tableData
这里只演示上移方法
<i class="iconfont icon-arrow-top" @click="upward(scope.row.seq)"></i>
data(){
tableData: [{name:'测试1',seq:1},{name:'测试1',seq:2},{name:'测试1',seq:3}]
}
methods: {
let currentObj = this.tableData[seq - 1]
let currentSeq = currentObj.seq
let changeObj = this.tableData[seq - 2]
let changeSeq = changeObj.seq
currentObj.seq = changeSeq //交换赋值
changeObj.seq = currentSeq //交换赋值
this.tableData.sort(count.sort('seq')) //重新渲染
}
这个count.sort是一个自定义方法。在我的count.js中
prop是需要排序的属性
PS：后台给的数据可能是字符串，比较时会出问题。需要转一下
这段代码来自
https://www.cnblogs.com/xljzlw/p/3694861.html#undefined
let count = {
sort: function (prop) {
return function (obj1, obj2) {
var val1 = obj1[prop]
var val2 = obj2[prop]
if (!isNaN(Number(val1)) && !isNaN(Number(val2))) {
val1 = Number(val1)
val2 = Number(val2)
}
if (val1 < val2) {
return -1
} else if (val1 > val2) {
return 1
} else {
return 0
}
}
}
}
export default count
