element-ui table 默认排序规则
时间: 2023-06-28 19:11:07 浏览: 69
Element UI 的表格组件默认排序规则是按照字符串的 Unicode 编码进行排序的,即按照字母表顺序进行排序。如果需要进行数字或日期类型的排序,需要自定义排序函数。可以使用 `sort-method` 属性来指定一个自定义的排序函数。例如,如果要按照数字大小进行排序,可以使用以下代码:
```html
<template>
<el-table :data="tableData" :columns="tableColumns" :sort-method="sortMethod"></el-table>
</template>
<script>
export default {
data() {
return {
tableData: [
{ name: 'John', age: 20 },
{ name: 'Mary', age: 18 },
{ name: 'Bob', age: 25 }
],
tableColumns: [
{ label: 'Name', prop: 'name', sortable: true },
{ label: 'Age', prop: 'age', sortable: true }
]
}
},
methods: {
sortMethod(a, b, prop) {
if (prop === 'age') {
return a[prop] - b[prop];
} else {
return a[prop].localeCompare(b[prop], 'zh-Hans-CN', { sensitivity: 'accent' });
}
}
}
}
</script>
```
在上面的代码中,我们使用 `sort-method` 属性指定了一个自定义的排序函数 `sortMethod`,该函数接受三个参数:要比较的两个数据对象和当前排序的属性名。在该函数中,我们判断了当前排序的属性名,如果是 `age` 属性,则按照数字大小进行排序;如果是其他属性,则按照中文字符的顺序进行排序。