Column排序,筛选该如何处理?
lencx opened this issue · 5 comments
lencx commented
有两个疑问可以麻烦解答一下吗?
- Column中的
sorter
,onFilter
是通过Table的onChange
事件去单独处理吗? - useFormTable配置中
search
方法的参数如何与Column中的sorter
,onFilter
参数进行合并?
JIACHENG9 commented
你是想在 Table 使用 sorter 访问后台?比如 https://ant.design/components/table-cn/#components-table-demo-ajax
这个场景不适用于 useFormTable。useFormTable 是用于表单作为查询条件,进行搜索,之后请求后台,Table 展示。而问题的需求是想不通过 Form 作为查询条件,而是通过 Table 来作为查询条件去请求后台。
在业务里,要是有 Form,又在 Table 里去做查询是不推荐的,FormTable 比 在 Table 里做 sorter 及 filter 更好的地方在于回填及以及更多的搜索条件。
那需要有什么方式来做?
- 使用 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>
- 加一个场景,比如 useRemoteTable 的场景。(需要在 sunflower 加上)
const { Table } = useRemoteTable({
sorter: () => Promise,
filter: () => Promise,
});
<Table />
lencx commented
好的,谢谢了。确实是想在Table使用sorter访问后台,尝试了很多方法,行不通,就来请教一下。
lencx commented
嗯嗯,谢谢了