Antd Pro ProTable 表格按指定列排序

例如，Antd Pro 列表中，我想按照创建时间这列正序或倒序重新排列。

字段配置

{
  title: '创建时间',
  dataIndex: 'CreatedAt',
  valueType: 'dateTime',
  search: false,
  sorter: true,
},

request 请求

export async function getItems(
  params: {
    current?: number;
    pageSize?: number;
  },
  sort: any,
  options?: { [key: string]: any },
) {
  for (const [key, value] of Object.entries(sort)) {
    params[key + 'Sort'] = value;
  }
  return request<API.Items>('/api/getItems', {
    method: 'GET',
    params: {
      ...params,
    },
    ...(options || {}),
  });
}

sort 的数据结构

{CreatedAt: 'ascend'}
{CreatedAt: 'descend'}

测试了一下，如果是多列可以排序，每次只会有一个生效。 不存在两个字段同时参与排序的情况。

请求格式

http://localhost:8000/api/getItems?current=1&pageSize=20&CreatedAtSort=ascend

后台 API

后台判断是否存在 CreatedAtSort 查询参数即可。

tags: Ant Design Pro

关于作者 🌱

我是来自山东烟台的一名开发者，有敢兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊， 查看更多联系方式