From 43c5bf2142c0952a2b53b85bac719a086dc6c69a Mon Sep 17 00:00:00 2001 From: RSS1102 Date: Mon, 27 Oct 2025 19:55:43 +0800 Subject: [PATCH 1/7] feat(popup): expose `popper` instance through `getPopper` method --- packages/components/popup/popup.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/components/popup/popup.tsx b/packages/components/popup/popup.tsx index c0c1091ead..2e3a85c629 100644 --- a/packages/components/popup/popup.tsx +++ b/packages/components/popup/popup.tsx @@ -249,6 +249,7 @@ export default defineComponent({ getOverlayState: () => ({ hover: isOverlayHover.value, }), + getPopper: () => popper, /** close is going to be deprecated. visible is enough */ close: () => hide(), }); From e4e1552db50add02c02ad69fd348d3fb608bd5be Mon Sep 17 00:00:00 2001 From: RSS1102 Date: Tue, 28 Oct 2025 10:56:51 +0800 Subject: [PATCH 2/7] =?UTF-8?q?feat(popup):=20=E6=B7=BB=E5=8A=A0=20`getPop?= =?UTF-8?q?per`=20=E6=96=B9=E6=B3=95=E4=BB=A5=E8=8E=B7=E5=8F=96=E5=BD=93?= =?UTF-8?q?=E5=89=8D=E7=BB=84=E4=BB=B6=E7=9A=84=20popper=20=E5=AE=9E?= =?UTF-8?q?=E4=BE=8B=EF=BC=8C=E5=B9=B6=E6=9B=B4=E6=96=B0=E7=9B=B8=E5=85=B3?= =?UTF-8?q?=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/components/popup/popup.en-US.md | 2 ++ packages/components/popup/popup.md | 6 ++++-- packages/components/popup/props.ts | 2 +- packages/components/popup/type.ts | 8 +++++++- 4 files changed, 14 insertions(+), 4 deletions(-) diff --git a/packages/components/popup/popup.en-US.md b/packages/components/popup/popup.en-US.md index 4e253ac12b..001168ab94 100644 --- a/packages/components/popup/popup.en-US.md +++ b/packages/components/popup/popup.en-US.md @@ -1,6 +1,7 @@ :: BASE_DOC :: ## API + ### Popup Props name | type | default | description | required @@ -43,4 +44,5 @@ name | params | return | description -- | -- | -- | -- getOverlay | \- | `HTMLElement` | used to get overly html element getOverlayState | \- | `{ hover: boolean }` | get mouseover state of overlay +getPopper | \- | `typeof createPopper ` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
update | \- | \- | used to update overlay content diff --git a/packages/components/popup/popup.md b/packages/components/popup/popup.md index fe89a68e82..c21978be8f 100644 --- a/packages/components/popup/popup.md +++ b/packages/components/popup/popup.md @@ -37,11 +37,12 @@ 如果您不确定问题是否是由该规则引起的,或者确定该规则不是问题的根本原因,请在 `GitHub` 上提出一个 `issue`,并提供可以重现问题的代码。这将有助于我们更好地了解您的问题并提供更好的帮助。 ## API + ### Popup Props -名称 | 类型 | 默认值 | 说明 | 必传 +名称 | 类型 | 默认值 | 描述 | 必传 -- | -- | -- | -- | -- -attach | String / Function | 'body' | 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body。TS 类型:`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N +attach | String / Function | 'body' | 指定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body。TS 类型:`AttachNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N content | String / Slot / Function | - | 浮层里面的内容。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N default | String / Slot / Function | - | 触发元素,同 triggerElement。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N delay | Number / Array | - | 延时显示或隐藏浮层,[延迟显示的时间,延迟隐藏的时间],单位:毫秒。如果只有一个时间,则表示显示和隐藏的延迟时间相同。示例 `'300'` 或者 `[200, 200]`。默认为:[250, 150]。TS 类型:`number \| Array` | N @@ -79,4 +80,5 @@ visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | 当 -- | -- | -- | -- getOverlay | \- | `HTMLElement` | 获取浮层元素 getOverlayState | \- | `{ hover: boolean }` | 获取浮层悬浮状态 +getPopper | \- | `typeof createPopper ` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
update | \- | \- | 更新浮层内容 diff --git a/packages/components/popup/props.ts b/packages/components/popup/props.ts index 735ac63703..63fd2b7c12 100644 --- a/packages/components/popup/props.ts +++ b/packages/components/popup/props.ts @@ -8,7 +8,7 @@ import { TdPopupProps } from './type'; import { PropType } from 'vue'; export default { - /** 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body */ + /** 指定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body */ attach: { type: [String, Function] as PropType, default: 'body' as TdPopupProps['attach'], diff --git a/packages/components/popup/type.ts b/packages/components/popup/type.ts index 5416bf4f17..ea7576d307 100644 --- a/packages/components/popup/type.ts +++ b/packages/components/popup/type.ts @@ -4,11 +4,12 @@ * 该文件为脚本自动生成文件,请勿随意修改。如需修改请联系 PMC * */ +import { createPopper } from '@popperjs/core'; import { TNode, ClassName, Styles, AttachNode } from '../common'; export interface TdPopupProps { /** - * 制定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body + * 指定挂载节点。数据类型为 String 时,会被当作选择器处理,进行节点查询。示例:'body' 或 () => document.body * @default 'body' */ attach?: AttachNode; @@ -121,6 +122,11 @@ export interface PopupInstanceFunctions { * 获取浮层悬浮状态 */ getOverlayState?: () => { hover: boolean }; + /** + * 获取当前组件 popper 实例 + * @default false + */ + getPopper?: () => typeof createPopper; /** * 更新浮层内容 */ From a809389f648fbd9f3522bdfb8efeb99a5c0a8a0f Mon Sep 17 00:00:00 2001 From: RSS1102 Date: Tue, 28 Oct 2025 11:26:05 +0800 Subject: [PATCH 3/7] =?UTF-8?q?docs(popup):=20=E4=BF=AE=E6=AD=A3=20`getPop?= =?UTF-8?q?per`=20=E6=96=B9=E6=B3=95=E7=9A=84=E7=B1=BB=E5=9E=8B=E6=8F=8F?= =?UTF-8?q?=E8=BF=B0=EF=BC=8C=E5=8E=BB=E9=99=A4=E5=A4=9A=E4=BD=99=E7=A9=BA?= =?UTF-8?q?=E6=A0=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/components/popup/popup.en-US.md | 2 +- packages/components/popup/popup.md | 2 +- packages/components/popup/type.ts | 1 - 3 files changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/components/popup/popup.en-US.md b/packages/components/popup/popup.en-US.md index 001168ab94..00c4c67bde 100644 --- a/packages/components/popup/popup.en-US.md +++ b/packages/components/popup/popup.en-US.md @@ -44,5 +44,5 @@ name | params | return | description -- | -- | -- | -- getOverlay | \- | `HTMLElement` | used to get overly html element getOverlayState | \- | `{ hover: boolean }` | get mouseover state of overlay -getPopper | \- | `typeof createPopper ` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
+getPopper | \- | `typeof createPopper` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
update | \- | \- | used to update overlay content diff --git a/packages/components/popup/popup.md b/packages/components/popup/popup.md index c21978be8f..71ce12f7d7 100644 --- a/packages/components/popup/popup.md +++ b/packages/components/popup/popup.md @@ -80,5 +80,5 @@ visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | 当 -- | -- | -- | -- getOverlay | \- | `HTMLElement` | 获取浮层元素 getOverlayState | \- | `{ hover: boolean }` | 获取浮层悬浮状态 -getPopper | \- | `typeof createPopper ` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
+getPopper | \- | `typeof createPopper` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
update | \- | \- | 更新浮层内容 diff --git a/packages/components/popup/type.ts b/packages/components/popup/type.ts index ea7576d307..c98acab357 100644 --- a/packages/components/popup/type.ts +++ b/packages/components/popup/type.ts @@ -124,7 +124,6 @@ export interface PopupInstanceFunctions { getOverlayState?: () => { hover: boolean }; /** * 获取当前组件 popper 实例 - * @default false */ getPopper?: () => typeof createPopper; /** From b3079de2bac01159d63a4337ee7440921582d541 Mon Sep 17 00:00:00 2001 From: RSS1102 Date: Wed, 29 Oct 2025 14:27:12 +0800 Subject: [PATCH 4/7] =?UTF-8?q?fix(popup):=20=E6=9B=B4=E6=96=B0=20`getPopp?= =?UTF-8?q?er`=20=E6=96=B9=E6=B3=95=E7=9A=84=E8=BF=94=E5=9B=9E=E7=B1=BB?= =?UTF-8?q?=E5=9E=8B=E4=B8=BA=20`Instance`?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/components/popup/popup.en-US.md | 2 +- packages/components/popup/popup.md | 2 +- packages/components/popup/type.ts | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/components/popup/popup.en-US.md b/packages/components/popup/popup.en-US.md index 00c4c67bde..9a6f6acfc3 100644 --- a/packages/components/popup/popup.en-US.md +++ b/packages/components/popup/popup.en-US.md @@ -44,5 +44,5 @@ name | params | return | description -- | -- | -- | -- getOverlay | \- | `HTMLElement` | used to get overly html element getOverlayState | \- | `{ hover: boolean }` | get mouseover state of overlay -getPopper | \- | `typeof createPopper` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
+getPopper | \- | `Instance` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { Instance } from '@popperjs/core'`
update | \- | \- | used to update overlay content diff --git a/packages/components/popup/popup.md b/packages/components/popup/popup.md index 71ce12f7d7..276a9b41e2 100644 --- a/packages/components/popup/popup.md +++ b/packages/components/popup/popup.md @@ -80,5 +80,5 @@ visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | 当 -- | -- | -- | -- getOverlay | \- | `HTMLElement` | 获取浮层元素 getOverlayState | \- | `{ hover: boolean }` | 获取浮层悬浮状态 -getPopper | \- | `typeof createPopper` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { createPopper } from '@popperjs/core'`
+getPopper | \- | `Instance` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { Instance } from '@popperjs/core'`
update | \- | \- | 更新浮层内容 diff --git a/packages/components/popup/type.ts b/packages/components/popup/type.ts index c98acab357..e49d301cc5 100644 --- a/packages/components/popup/type.ts +++ b/packages/components/popup/type.ts @@ -4,7 +4,7 @@ * 该文件为脚本自动生成文件,请勿随意修改。如需修改请联系 PMC * */ -import { createPopper } from '@popperjs/core'; +import { Instance } from '@popperjs/core'; import { TNode, ClassName, Styles, AttachNode } from '../common'; export interface TdPopupProps { @@ -125,7 +125,7 @@ export interface PopupInstanceFunctions { /** * 获取当前组件 popper 实例 */ - getPopper?: () => typeof createPopper; + getPopper?: () => Instance; /** * 更新浮层内容 */ From 5f5a21be7bc67208d44273f8ba0ee4e1fe3975ff Mon Sep 17 00:00:00 2001 From: RSS1102 Date: Wed, 29 Oct 2025 14:54:40 +0800 Subject: [PATCH 5/7] =?UTF-8?q?fix(popup):=20=E6=9B=B4=E6=96=B0=20`getOver?= =?UTF-8?q?lay`=20=E5=92=8C=20`getPopper`=20=E6=96=B9=E6=B3=95=E7=9A=84?= =?UTF-8?q?=E8=BF=94=E5=9B=9E=E7=B1=BB=E5=9E=8B=E4=B8=BA=20`HTMLElement=20?= =?UTF-8?q?|=20null`=20=E5=92=8C=20`Instance=20|=20null`?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/components/popup/popup.en-US.md | 4 ++-- packages/components/popup/popup.md | 4 ++-- packages/components/popup/type.ts | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/components/popup/popup.en-US.md b/packages/components/popup/popup.en-US.md index 9a6f6acfc3..4cce5f41ee 100644 --- a/packages/components/popup/popup.en-US.md +++ b/packages/components/popup/popup.en-US.md @@ -42,7 +42,7 @@ visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | [see name | params | return | description -- | -- | -- | -- -getOverlay | \- | `HTMLElement` | used to get overly html element +getOverlay | \- | `HTMLElement \| null` | used to get overly html element getOverlayState | \- | `{ hover: boolean }` | get mouseover state of overlay -getPopper | \- | `Instance` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { Instance } from '@popperjs/core'`
+getPopper | \- | `Instance \| null` | get the popup component popper instance。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { Instance } from '@popperjs/core'`
update | \- | \- | used to update overlay content diff --git a/packages/components/popup/popup.md b/packages/components/popup/popup.md index 276a9b41e2..8771597a33 100644 --- a/packages/components/popup/popup.md +++ b/packages/components/popup/popup.md @@ -78,7 +78,7 @@ visible-change | `(visible: boolean, context: PopupVisibleChangeContext)` | 当 名称 | 参数 | 返回值 | 描述 -- | -- | -- | -- -getOverlay | \- | `HTMLElement` | 获取浮层元素 +getOverlay | \- | `HTMLElement \| null` | 获取浮层元素 getOverlayState | \- | `{ hover: boolean }` | 获取浮层悬浮状态 -getPopper | \- | `Instance` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { Instance } from '@popperjs/core'`
+getPopper | \- | `Instance \| null` | 获取当前组件 popper 实例。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/popup/type.ts)。
`import { Instance } from '@popperjs/core'`
update | \- | \- | 更新浮层内容 diff --git a/packages/components/popup/type.ts b/packages/components/popup/type.ts index e49d301cc5..5d48cdd6bc 100644 --- a/packages/components/popup/type.ts +++ b/packages/components/popup/type.ts @@ -117,7 +117,7 @@ export interface PopupInstanceFunctions { /** * 获取浮层元素 */ - getOverlay?: () => HTMLElement; + getOverlay?: () => HTMLElement | null; /** * 获取浮层悬浮状态 */ @@ -125,7 +125,7 @@ export interface PopupInstanceFunctions { /** * 获取当前组件 popper 实例 */ - getPopper?: () => Instance; + getPopper?: () => Instance | null; /** * 更新浮层内容 */ From 627db507951acf25d74efde7d0df2569c17947fc Mon Sep 17 00:00:00 2001 From: tdesign-bot Date: Thu, 30 Oct 2025 10:08:33 +0000 Subject: [PATCH 6/7] chore: stash changelog [ci skip] --- packages/tdesign-vue-next/.changelog/pr-6096.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 packages/tdesign-vue-next/.changelog/pr-6096.md diff --git a/packages/tdesign-vue-next/.changelog/pr-6096.md b/packages/tdesign-vue-next/.changelog/pr-6096.md new file mode 100644 index 0000000000..c27a2fc8db --- /dev/null +++ b/packages/tdesign-vue-next/.changelog/pr-6096.md @@ -0,0 +1,6 @@ +--- +pr_number: 6096 +contributor: RSS1102 +--- + +- feat(popup): 新增 `getPopper()` 方法返回 popper 实例,用于基于 popper 进行动态操作 @RSS1102 ([#6096](https://github.com/Tencent/tdesign-vue-next/pull/6096)) From 845e13e33f65524068f197e095c23d346fd6fab8 Mon Sep 17 00:00:00 2001 From: tdesign-bot Date: Thu, 30 Oct 2025 10:10:55 +0000 Subject: [PATCH 7/7] chore: stash changelog [ci skip] --- packages/tdesign-vue-next/.changelog/pr-6096.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/tdesign-vue-next/.changelog/pr-6096.md b/packages/tdesign-vue-next/.changelog/pr-6096.md index c27a2fc8db..90943499ec 100644 --- a/packages/tdesign-vue-next/.changelog/pr-6096.md +++ b/packages/tdesign-vue-next/.changelog/pr-6096.md @@ -3,4 +3,4 @@ pr_number: 6096 contributor: RSS1102 --- -- feat(popup): 新增 `getPopper()` 方法返回 popper 实例,用于基于 popper 进行动态操作 @RSS1102 ([#6096](https://github.com/Tencent/tdesign-vue-next/pull/6096)) +- feat(popup): 新增 `getPopper()` 方法,将返回 popper 实例,用于基于 popper 进行动态操作的场景 @RSS1102 ([#6096](https://github.com/Tencent/tdesign-vue-next/pull/6096))