feat:createPortal,右键位置

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,
+                pageX: e.event.clientX,
-                pageY: e.event.pageY,
+                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 (
+        return <Fragment>
-                <Menu style={tmpStyle}>
+            {createPortal(
+                <Menu style={tmpStyle} >
                     {menuItem}
-                </Menu>
+                </Menu>,
-        )
+                document.body
+            )}
+        </Fragment>
     }
 
     return (