mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-12 20:43:11 +08:00
docs: 📖 Add FAQ about table filter logic
This commit is contained in:
parent
ddb0ac46ba
commit
c38324e863
@ -92,14 +92,14 @@ Same as `onRow` `onHeaderRow` `onCell` `onHeaderCell`
|
|||||||
<Table
|
<Table
|
||||||
onRow={(record, rowIndex) => {
|
onRow={(record, rowIndex) => {
|
||||||
return {
|
return {
|
||||||
onClick: (event) => {}, // click row
|
onClick: event => {}, // click row
|
||||||
onDoubleClick: (event) => {}, // double click row
|
onDoubleClick: event => {}, // double click row
|
||||||
onContextMenu: (event) => {}, // right button click row
|
onContextMenu: event => {}, // right button click row
|
||||||
onMouseEnter: (event) => {}, // mouse enter row
|
onMouseEnter: event => {}, // mouse enter row
|
||||||
onMouseLeave: (event) => {}, // mouse leave row
|
onMouseLeave: event => {}, // mouse leave row
|
||||||
};
|
};
|
||||||
}}
|
}}
|
||||||
onHeaderRow={(column) => {
|
onHeaderRow={column => {
|
||||||
return {
|
return {
|
||||||
onClick: () => {}, // click header row
|
onClick: () => {}, // click header row
|
||||||
};
|
};
|
||||||
@ -265,7 +265,7 @@ If `dataSource[i].key` is not provided, then you should specify the primary key
|
|||||||
// primary key is uid
|
// primary key is uid
|
||||||
return <Table rowKey="uid" />;
|
return <Table rowKey="uid" />;
|
||||||
// or
|
// or
|
||||||
return <Table rowKey={(record) => record.uid} />;
|
return <Table rowKey={record => record.uid} />;
|
||||||
```
|
```
|
||||||
|
|
||||||
## Migrate to v4
|
## Migrate to v4
|
||||||
@ -276,6 +276,12 @@ Besides, the breaking change is changing `dataIndex` from nest string path like
|
|||||||
|
|
||||||
## FAQ
|
## FAQ
|
||||||
|
|
||||||
### How to hide pagination when single page or not data
|
### How to hide pagination when single page or not data?
|
||||||
|
|
||||||
You can set `hideOnSinglePage` with `pagination` prop.
|
You can set `hideOnSinglePage` with `pagination` prop.
|
||||||
|
|
||||||
|
### Table will return to first page when filter data.
|
||||||
|
|
||||||
|
Table total page count usually reduce after filter data, we defaultly return to first page in case of current page is out of filtered results.
|
||||||
|
|
||||||
|
You may need to keep current page after filtering when fetch data from remote service, please check [this demo](https://codesandbox.io/s/yuanchengjiazaishuju-ant-design-demo-7y2uf) as workaround.
|
||||||
|
@ -95,16 +95,16 @@ const columns = [
|
|||||||
|
|
||||||
```jsx
|
```jsx
|
||||||
<Table
|
<Table
|
||||||
onRow={(record) => {
|
onRow={record => {
|
||||||
return {
|
return {
|
||||||
onClick: (event) => {}, // 点击行
|
onClick: event => {}, // 点击行
|
||||||
onDoubleClick: (event) => {},
|
onDoubleClick: event => {},
|
||||||
onContextMenu: (event) => {},
|
onContextMenu: event => {},
|
||||||
onMouseEnter: (event) => {}, // 鼠标移入行
|
onMouseEnter: event => {}, // 鼠标移入行
|
||||||
onMouseLeave: (event) => {},
|
onMouseLeave: event => {},
|
||||||
};
|
};
|
||||||
}}
|
}}
|
||||||
onHeaderRow={(column) => {
|
onHeaderRow={column => {
|
||||||
return {
|
return {
|
||||||
onClick: () => {}, // 点击表头行
|
onClick: () => {}, // 点击表头行
|
||||||
};
|
};
|
||||||
@ -269,7 +269,7 @@ class NameColumn extends Table.Column<User> {}
|
|||||||
// 比如你的数据主键是 uid
|
// 比如你的数据主键是 uid
|
||||||
return <Table rowKey="uid" />;
|
return <Table rowKey="uid" />;
|
||||||
// 或
|
// 或
|
||||||
return <Table rowKey={(record) => record.uid} />;
|
return <Table rowKey={record => record.uid} />;
|
||||||
```
|
```
|
||||||
|
|
||||||
## 从 v3 升级到 v4
|
## 从 v3 升级到 v4
|
||||||
@ -283,3 +283,9 @@ Table 移除了在 v3 中废弃的 `onRowClick`、`onRowDoubleClick`、`onRowMou
|
|||||||
### 如何在没有数据或只有一页数据时隐藏分页栏
|
### 如何在没有数据或只有一页数据时隐藏分页栏
|
||||||
|
|
||||||
你可以设置 `pagination` 的 `hideOnSinglePage` 属性为 `true`。
|
你可以设置 `pagination` 的 `hideOnSinglePage` 属性为 `true`。
|
||||||
|
|
||||||
|
### 表格过滤时会回到第一页?
|
||||||
|
|
||||||
|
前端过滤时通常条目总数会减少,从而导致总页数小于筛选前的当前页数,为了防止当前页面没有数据,我们默认会返回第一页。
|
||||||
|
|
||||||
|
如果你在使用远程分页,很可能需要保持当前页面,你可以参照这个 [受控例子](https://codesandbox.io/s/yuanchengjiazaishuju-ant-design-demo-7y2uf) 控制当前页面不变。
|
||||||
|
Loading…
Reference in New Issue
Block a user