design vue 实现表格开启列排序？很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。
开启排序
1、本地数据排序
column数据设置，需要开启的列设置sorter: (a, b) => a.address.length - b.address.length, 自定义排序方法
2、服务端排序sorter设置true
点击排序，表格触发change方法，接受参数
change (pagination, filters, sorter, { currentDataSource })
第三个参数就是排序信息
{field, order}
<a-table
:columns="header"
:dataSource="body"
:pagination="pagination"
@change="handleTableChange"
>
methods: {
handleTableChange (pagination, filters, {field, order}) {
this.sort = {
field: field || '',
order: order || ''
}
this.pagination.current = pagination.current
this.getList()
},
}如何设置第一次点击是降序
ant design vue 表格排序，默认点击排序顺序是[升序，降序，不排序] 如此循环
如何设置先降序后升序呢，api文档有提到
1、可以在column的每一项设置sortDirections: ['descend', 'ascend']
2、在表格直接设置sortDirections
<a-table :columns="header" :dataSource="body" :pagination="pagination" @change="handleTableChange" :sortDirections="['descend', 'ascend']" // 这里 >
3、用['descend' | 'ascend']写法不行，用数组['descend', 'ascend']
4、设置defaultSortOrder没有效果
补充知识：Ant Design Vue实现的表格排序点击第三次取消排序的解决方法
看完上述内容是否对您有帮助呢？如果还想对相关知识有进一步的了解或阅读更多相关文章，请关注亿速云行业资讯频道，感谢您对亿速云的支持。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
