vxe-column根据日期排序
时间: 2023-10-05 12:09:41 浏览: 174
要按日期对vxe-column进行排序,你需要设置`sortMethod`属性为一个自定义函数,该函数将日期字符串转换为日期对象,然后比较两个日期对象的差异。以下是一个示例:
```html
<vxe-table :data="tableData">
<vxe-column field="date" title="日期" sortable :sort-method="dateSortMethod"></vxe-column>
<vxe-column field="name" title="姓名"></vxe-column>
<vxe-column field="age" title="年龄"></vxe-column>
</vxe-table>
```
```javascript
dateSortMethod(a, b, sortOrder) {
const dateA = new Date(a).getTime();
const dateB = new Date(b).getTime();
return sortOrder === 'asc' ? dateA - dateB : dateB - dateA;
}
```
在这个示例中,我们定义了一个名为`dateSortMethod`的函数,它接收三个参数:`a`和`b`是要比较的两个日期字符串,`sortOrder`表示排序顺序(升序或降序)。在函数内部,我们将日期字符串转换为日期对象,并使用`getTime()`方法获取日期对象的时间戳。然后,我们根据排序顺序比较两个日期对象的时间戳,返回一个数字,表示它们之间的差异。如果`sortOrder`是升序,则返回`dateA - dateB`,否则返回`dateB - dateA`。
现在,当用户点击日期列的排序按钮时,表格将按日期排序。
阅读全文