From c9ecb34b0b3c139433a380ca3293a8af43c31662 Mon Sep 17 00:00:00 2001
From: Heising <heising@travelconnect.cn>
Date: Wed, 21 Aug 2024 13:46:35 +0800
Subject: [PATCH] fix(Popup): fix popup visible update position

---
 src/popup/Popup.tsx | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/popup/Popup.tsx b/src/popup/Popup.tsx
index ecf031ee43..7e0b78a1e0 100644
--- a/src/popup/Popup.tsx
+++ b/src/popup/Popup.tsx
@@ -18,6 +18,7 @@ import useWindowSize from '../hooks/useWindowSize';
 import { popupDefaultProps } from './defaultProps';
 import useDefaultProps from '../hooks/useDefaultProps';
 import useAttach from '../hooks/useAttach';
+import { getCssVarsValue } from '../_util/dom';
 
 export interface PopupProps extends TdPopupProps {
   // 是否触发展开收起动画，内部下拉式组件使用
@@ -114,15 +115,20 @@ const Popup = forwardRef<PopupRef, PopupProps>((originalProps, ref) => {
 
   const updateTimeRef = useRef(null);
   // 监听 trigger 节点或内容变化动态更新 popup 定位
-  useMutationObserver(getRefDom(triggerRef), () => {
-    clearTimeout(updateTimeRef.current);
-    updateTimeRef.current = setTimeout(() => popperRef.current?.update?.(), 0);
+  useMutationObserver(getRefDom(triggerRef), ([mutation]) => {
+    const isDisplayNone = getCssVarsValue('display', mutation.target as HTMLElement) === 'none';
+    if (visible && !isDisplayNone) {
+      clearTimeout(updateTimeRef.current);
+      updateTimeRef.current = setTimeout(() => popperRef.current?.update?.(), 0);
+    }
   });
   useEffect(() => () => clearTimeout(updateTimeRef.current), []);
 
   // 窗口尺寸变化时调整位置
   useEffect(() => {
-    requestAnimationFrame(() => popperRef.current?.update?.());
+    if (visible) {
+      requestAnimationFrame(() => popperRef.current?.update?.());
+    }
   }, [visible, content, windowHeight, windowWidth]);
 
   // 下拉展开时更新内部滚动条