Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Column排序,筛选该如何处理? #29

Closed
lencx opened this issue Jul 8, 2019 · 5 comments
Closed

Column排序,筛选该如何处理? #29

lencx opened this issue Jul 8, 2019 · 5 comments
Labels
question Further information is requested

Comments

@lencx
Copy link

lencx commented Jul 8, 2019

有两个疑问可以麻烦解答一下吗?

  1. Column中的sorteronFilter是通过Table的onChange事件去单独处理吗?
  2. useFormTable配置中search方法的参数如何与Column中的sorteronFilter参数进行合并?
@JIACHENG9
Copy link
Contributor

JIACHENG9 commented Jul 8, 2019

你是想在 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>
  1. 加一个场景,比如 useRemoteTable 的场景。(需要在 sunflower 加上)
const { Table }  = useRemoteTable({
  sorter: () => Promise,
  filter: () => Promise,
});

<Table />

@JIACHENG9 JIACHENG9 added the question Further information is requested label Jul 8, 2019
@lencx
Copy link
Author

lencx commented Jul 8, 2019

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

@JIACHENG9
Copy link
Contributor

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

@lencx
Copy link
Author

lencx commented Jul 9, 2019

嗯嗯,谢谢了

@JIACHENG9
Copy link
Contributor

JIACHENG9 commented Aug 23, 2019

@lencx sunflower-antd@0.2.0

import { useFormTable } from 'sunflower-antd';

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants