From c7008cb5ca78bdca49cfba3771da10e0b8b247dd Mon Sep 17 00:00:00 2001
From: shixiaohua <shi_xiaohua@qq.com>
Date: Thu, 22 Feb 2024 10:21:41 +0800
Subject: [PATCH] =?UTF-8?q?feat:createPortal,=E5=8F=B3=E9=94=AE=E4=BD=8D?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ItemTree/index.jsx | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/ItemTree/index.jsx b/src/components/ItemTree/index.jsx
index edbf668..ffa2a02 100644
--- a/src/components/ItemTree/index.jsx
+++ b/src/components/ItemTree/index.jsx
@@ -1,4 +1,4 @@
-import React, {useEffect, useMemo, useState} from 'react';
+import React, {Fragment, useEffect, useMemo, useState} from 'react';
 import {Input, Menu, Tree} from 'antd';
 import {FolderOutlined, FileMarkdownOutlined, FileOutlined} from '@ant-design/icons';
 import "./index.less"
@@ -15,6 +15,7 @@ import CloseDir from "./CloseDir";
 import DirAddFile from "./DirAddFile";
 import DirDeleteFile from "./DirDeleteFile";
 import DirAddDir from "./DirAddDir";
+import {createPortal} from "react-dom";
 // const defaultData = [];
 // 将树平铺用于查找
 const dataList = [];
@@ -258,8 +259,8 @@ const ItemTree = (prop) => {
         console.log("e,node", e)
         setState({
             rightClickNodeTreeItem: {
-                pageX: e.event.pageX,
-                pageY: e.event.pageY,
+                pageX: e.event.clientX,
+                pageY: e.event.clientY,
                 key: e.node.key,
                 dirFlag: e.node.dirFlag,
                 title: getFileNameByPath(e.node.key),
@@ -306,11 +307,14 @@ const ItemTree = (prop) => {
             </Menu.Item>,
             <Menu.Item key='6' onClick={() => {setState("")}}>关闭菜单</Menu.Item>
         ]
-        return (
-                <Menu style={tmpStyle}>
+        return <Fragment>
+            {createPortal(
+                <Menu style={tmpStyle} >
                     {menuItem}
-                </Menu>
-        )
+                </Menu>,
+                document.body
+            )}
+        </Fragment>
     }
 
     return (