Skip to content

Commit

Permalink
docs: tree-select supports onPopupScroll (#48636)
Browse files Browse the repository at this point in the history 
* docs: tree-select supports onPopupScroll props

* docs: update demo

* docs: update version

* test: update snapshots

* fix: update demo

---------

Co-authored-by: lijianan <574980606@qq.com>
  • Loading branch information
@wanpan11 @li-jia-nan
wanpan11 and li-jia-nan committed Apr 28, 2024
1 parent 97b8913 commit 4020f65
Show file tree
Hide file tree
Showing 5 changed files with 149 additions and 5 deletions.
124 changes: 122 additions & 2 deletions components/tree-select/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Expand Up @@ -423,7 +423,7 @@ exports[`renders components/tree-select/demo/basic.tsx extend context correctly
</div>
<div
aria-grabbed="false"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open ant-select-tree-treenode-leaf-last"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open"
draggable="false"
>
<span
Expand Down Expand Up @@ -451,6 +451,126 @@ exports[`renders components/tree-select/demo/basic.tsx extend context correctly
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open"
draggable="false"
>
<span
aria-hidden="true"
class="ant-select-tree-indent"
>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start ant-select-tree-indent-unit-end"
/>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start"
/>
</span>
<span
class="ant-select-tree-switcher ant-select-tree-switcher-noop"
/>
<span
class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal"
title="leaf3"
>
<span
class="ant-select-tree-title"
>
leaf3
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open"
draggable="false"
>
<span
aria-hidden="true"
class="ant-select-tree-indent"
>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start ant-select-tree-indent-unit-end"
/>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start"
/>
</span>
<span
class="ant-select-tree-switcher ant-select-tree-switcher-noop"
/>
<span
class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal"
title="leaf4"
>
<span
class="ant-select-tree-title"
>
leaf4
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open"
draggable="false"
>
<span
aria-hidden="true"
class="ant-select-tree-indent"
>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start ant-select-tree-indent-unit-end"
/>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start"
/>
</span>
<span
class="ant-select-tree-switcher ant-select-tree-switcher-noop"
/>
<span
class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal"
title="leaf5"
>
<span
class="ant-select-tree-title"
>
leaf5
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open ant-select-tree-treenode-leaf-last"
draggable="false"
>
<span
aria-hidden="true"
class="ant-select-tree-indent"
>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start ant-select-tree-indent-unit-end"
/>
<span
class="ant-select-tree-indent-unit ant-select-tree-indent-unit-start"
/>
</span>
<span
class="ant-select-tree-switcher ant-select-tree-switcher-noop"
/>
<span
class="ant-select-tree-node-content-wrapper ant-select-tree-node-content-wrapper-normal"
title="leaf6"
>
<span
class="ant-select-tree-title"
>
leaf6
</span>
</span>
</div>
<div
aria-grabbed="false"
class="ant-select-tree-treenode ant-select-tree-treenode-switcher-open ant-select-tree-treenode-leaf-last"
Expand Down Expand Up @@ -527,7 +647,7 @@ exports[`renders components/tree-select/demo/basic.tsx extend context correctly
<b
style="color: rgb(0, 136, 204);"
>
leaf3
leaf11
</b>
</span>
</span>
Expand Down
26 changes: 24 additions & 2 deletions components/tree-select/demo/basic.tsx
View file
@@ -1,3 +1,4 @@
import type { SyntheticEvent } from 'react';
import React, { useState } from 'react';
import { TreeSelect } from 'antd';

Expand All @@ -18,15 +19,31 @@ const treeData = [
value: 'leaf2',
title: 'leaf2',
},
{
value: 'leaf3',
title: 'leaf3',
},
{
value: 'leaf4',
title: 'leaf4',
},
{
value: 'leaf5',
title: 'leaf5',
},
{
value: 'leaf6',
title: 'leaf6',
},
],
},
{
value: 'parent 1-1',
title: 'parent 1-1',
children: [
{
value: 'leaf3',
title: <b style={{ color: '#08c' }}>leaf3</b>,
value: 'leaf11',
title: <b style={{ color: '#08c' }}>leaf11</b>,
},
],
},
Expand All @@ -40,6 +57,10 @@ const App: React.FC = () => {
setValue(newValue);
};

const onPopupScroll = (e: SyntheticEvent) => {
console.log('onPopupScroll', e);
};

return (
<TreeSelect
showSearch
Expand All @@ -51,6 +72,7 @@ const App: React.FC = () => {
treeDefaultExpandAll
onChange={onChange}
treeData={treeData}
onPopupScroll={onPopupScroll}
/>
);
};
Expand Down
1 change: 1 addition & 0 deletions components/tree-select/index.en-US.md
View file
Expand Up @@ -86,6 +86,7 @@ Common props ref：[Common props](/docs/react/common-props)
| onSearch | A callback function, can be executed when the search input changes | function(value: string) | - | |
| onSelect | A callback function, can be executed when you select a treeNode | function(value, node, extra) | - | |
| onTreeExpand | A callback function, can be executed when treeNode expanded | function(expandedKeys) | - | |
| onPopupScroll | Called when dropdown scrolls | (event: MouseEvent) => void | - | 5.17.0 |

### Tree Methods

Expand Down
1 change: 1 addition & 0 deletions components/tree-select/index.zh-CN.md
View file
Expand Up @@ -87,6 +87,7 @@ demo:
| onSearch | 文本框值变化时的回调 | function(value: string) | - | |
| onSelect | 被选中时调用 | function(value, node, extra) | - | |
| onTreeExpand | 展示节点时调用 | function(expandedKeys) | - | |
| onPopupScroll | 下拉列表滚动时的回调 | (event: MouseEvent) => void | - | 5.17.0 |

### Tree 方法

Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Expand Up @@ -159,7 +159,7 @@
"rc-textarea": "~1.6.3",
"rc-tooltip": "~6.2.0",
"rc-tree": "~5.8.5",
"rc-tree-select": "~5.19.0",
"rc-tree-select": "~5.20.0",
"rc-upload": "~4.5.2",
"rc-util": "^5.39.1",
"scroll-into-view-if-needed": "^3.1.0",
Expand Down

0 comments on commit 4020f65

Please sign in to comment.