Column排序，筛选该如何处理？

[ant-design]

Column排序，筛选该如何处理？

[JIACHENG9]

你是想在 Table 使用 sorter 访问后台？比如 https://ant.design/components/table-cn/#components-table-demo-ajax

这个场景不适用于 useFormTable。useFormTable 是用于表单作为查询条件，进行搜索，之后请求后台，Table 展示。而问题的需求是想不通过 Form 作为查询条件，而是通过 Table 来作为查询条件去请求后台。

在业务里，要是有 Form，又在 Table 里去做查询是不推荐的，FormTable 比 在 Table 里做 sorter 及 filter 更好的地方在于回填及以及更多的搜索条件。

那需要有什么方式来做？

1. 使用 useFormTable，sorter 及 filter 只是后台查询的条件，在 Form 中加 Select 即可，而不使用 Table 的 sorter 及 filter

import { Select } from 'antd';
const {Form, Table} = useFormTable(config);

<Form>
  <Form.Item name="sorted">
    <Select>
      <Select.Option value="1">sorter 1</Select.Option>
      <Select.Option value="2">sorter 2</Select.Option>
    </Select>
  </Form.Item>

  <Form.Item name="filter">
    <Select>
      <Select.Option value="1">filter 1</Select.Option>
      <Select.Option value="2">filter 2</Select.Option>
    </Select>
  </Form.Item>
</Form>

2. 加一个场景，比如 useRemoteTable 的场景。（需要在 sunflower 加上）

const { Table }  = useRemoteTable({
  sorter: () => Promise,
  filter: () => Promise,
});

<Table />

[lencx]

好的，谢谢了。确实是想在Table使用sorter访问后台，尝试了很多方法，行不通，就来请教一下。

[JIACHENG9]

@lencx 是很通用的需求，会加上一个 useRemoteTable

[lencx]

嗯嗯，谢谢了

[JIACHENG9]

@lencx [email protected]

import { useFormTable } from 'sunflower-antd';

useFormTable({
  search({ currentPage, pageSize, filters, sorter, ...formValues })
})