From f14e6c0e34b92bb741c5e73e2eaf8d99f39476a6 Mon Sep 17 00:00:00 2001
From: 1708-huayu <57060237+1708-huayu@users.noreply.github.com>
Date: Tue, 22 Oct 2024 16:50:40 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E7=82=B9=E5=87=BB=E5=85=83?=
 =?UTF-8?q?=E7=B4=A0=E5=A4=96=E9=83=A8=E4=BA=8B=E4=BB=B6=E5=90=8E=E5=85=B3?=
 =?UTF-8?q?=E9=97=AD=E8=8F=9C=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ItemTree/index.jsx | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/components/ItemTree/index.jsx b/src/components/ItemTree/index.jsx
index 67bbead..7670486 100644
--- a/src/components/ItemTree/index.jsx
+++ b/src/components/ItemTree/index.jsx
@@ -166,6 +166,7 @@ const ItemTree = (prop) => {
     const [defaultValueState, setDefaultValueState] = useState(flushTree(prop.filePath));
     generateList(defaultValueState);
     const [state, setState] = useState();
+    const [inFrame, setInFrame] = useState(true);
     useEffect(() => {
         setDefaultValueState(flushTree(prop.filePath))
     }, [prop]);
@@ -294,7 +295,18 @@ const ItemTree = (prop) => {
         });
     }
     const getNodeTreeRightClickMenu = () => {
-        console.log("state", state, isEmpty(state))
+        useEffect(() => {
+            const handleKeyDown = (event) => {
+                if (!inFrame) {
+                    event.preventDefault(); // 阻止默认行为
+                    setState("");
+                }
+            };
+            document.addEventListener('click', handleKeyDown);
+            return () => {
+                document.removeEventListener('click', handleKeyDown);
+            };
+        });
         if (isEmpty(state)) {
             return
         }
@@ -321,6 +333,7 @@ const ItemTree = (prop) => {
             menuItem.push(getMenuItem('6',<DirDeleteFile filePath={key} />))
         }
         menuItem.push(getMenuItem('7',<OpenInDir filePath={key} />))
+
         return <Fragment>
             {createPortal(
                 <Menu style={tmpStyle}  onClick={e =>
@@ -328,7 +341,18 @@ const ItemTree = (prop) => {
                                 console.log('onClick',e)
                             }
                         }
-                      onMouseLeave={e => {setState("");}}
+                      // 鼠标离开
+                      onMouseLeave={e => {
+                          console.log('onMouseLeave',e)
+                          // setState("");
+                          setInFrame(false)
+                      }}
+                      // 鼠标进入
+                      onMouseEnter={e => {
+                          console.log('onMouseEnter',e)
+                          // setState("");
+                          setInFrame(true)
+                      }}
                       items={menuItem}>
                 </Menu>,
                 document.body