diff --git a/components/tree/Tree.tsx b/components/tree/Tree.tsx index 52012c78e..d4ae4ef79 100644 --- a/components/tree/Tree.tsx +++ b/components/tree/Tree.tsx @@ -5,7 +5,7 @@ import VcTree from '../vc-tree'; import PropTypes from '../_util/vue-types'; import { filterEmpty } from '../_util/props-util'; import initDefaultProps from '../_util/props-util/initDefaultProps'; -import type { DataNode, EventDataNode, FieldNames, Key } from '../vc-tree/interface'; +import type { DataNode, EventDataNode, FieldNames, Key, ScrollTo } from '../vc-tree/interface'; import type { TreeNodeProps } from '../vc-tree/props'; import { treeProps as vcTreeProps } from '../vc-tree/props'; import useConfigInject from '../_util/hooks/useConfigInject'; @@ -168,11 +168,15 @@ export default defineComponent({ ); const { prefixCls, direction, virtual } = useConfigInject('tree', props); const treeRef = ref(); + const scrollTo: ScrollTo = scroll => { + treeRef.value?.scrollTo(scroll); + }; expose({ treeRef, onNodeExpand: (...args) => { treeRef.value?.onNodeExpand(...args); }, + scrollTo, selectedKeys: computed(() => treeRef.value?.selectedKeys), checkedKeys: computed(() => treeRef.value?.checkedKeys), halfCheckedKeys: computed(() => treeRef.value?.halfCheckedKeys), diff --git a/components/tree/index.en-US.md b/components/tree/index.en-US.md index c29368f89..9cfec4d1d 100644 --- a/components/tree/index.en-US.md +++ b/components/tree/index.en-US.md @@ -56,6 +56,12 @@ Almost anything can be represented in a tree structure. Examples include directo | rightClick | Callback function for when the user right clicks a treeNode | function({event, node}) | | select | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | +### Tree Methods + +| Name | Description | +| --- | --- | +| scrollTo({ key: string \| number; align?: 'top' \| 'bottom' \| 'auto'; offset?: number }) | Scroll to key item in virtual scroll | + ### TreeNode | Property | Description | Type | Default | Version | diff --git a/components/tree/index.zh-CN.md b/components/tree/index.zh-CN.md index 984f6e16d..0e58afa34 100644 --- a/components/tree/index.zh-CN.md +++ b/components/tree/index.zh-CN.md @@ -57,6 +57,12 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Xh-oWqg9k/Tree.svg | rightClick | 响应右键点击 | function({event, node}) | | select | 点击树节点触发 | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | +### Tree 方法 + +| 名称 | 说明 | +| --- | --- | +| scrollTo({ key: string \| number; align?: 'top' \| 'bottom' \| 'auto'; offset?: number }) | 虚拟滚动下,滚动到指定 key 条目 | + ### TreeNode | 参数 | 说明 | 类型 | 默认值 | 版本 |