fix: 修复icon版本问题

JackySoft · Sep 25, 2024 · 1fdcce3 · 1fdcce3
1 parent 06b19c8
commit 1fdcce3
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 22 deletions.
diff --git a/packages/admin/src/components/Menu/Menu.tsx b/packages/admin/src/components/Menu/Menu.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { Menu } from 'antd';
 import type { MenuProps, MenuTheme } from 'antd';
@@ -29,15 +29,13 @@ const MenuComponent: React.FC = () => {
   const getTreeMenu = (menuList: IMenuItem[], treeList: MenuItem[] = []) => {
     menuList.forEach((item) => {
       if (item.type === 1 && item.status === 1) {
-        const iconComp = Icons[item.icon as keyof typeof Icons];
+        const iconsList: { [key: string]: any } = Icons;
         if (item.buttons?.length || !item.children) {
           const path = `/project/${env}/${projectId}/${item.page_id || 0}`;
-          return treeList.push(getMenuItem(item.name, path, <Icon component={iconComp as React.ForwardRefExoticComponent<any>} />));
+          return treeList.push(getMenuItem(item.name, path, React.createElement(iconsList[item.icon])));
         }
         const path = `/project/${env}/${projectId}/${item.id}`;
-        treeList.push(
-          getMenuItem(item.name, path, <Icon component={iconComp as React.ForwardRefExoticComponent<any>} />, getTreeMenu(item.children || [])),
-        );
+        treeList.push(getMenuItem(item.name, path, React.createElement(iconsList[item.icon]), getTreeMenu(item.children || [])));
       }
     });
     return treeList;

diff --git a/packages/editor/src/packages/Basic/Icon/Icon.tsx b/packages/editor/src/packages/Basic/Icon/Icon.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useImperativeHandle, forwardRef } from 'react';
-import Icon, * as Icons from '@ant-design/icons';
+import * as Icons from '@ant-design/icons';
 import { ComponentType } from '@/packages/types';
 /**
  *
@@ -35,18 +35,17 @@ const MImage = (
   const handleClick = () => {
     onClick?.();
   };
-  const iconComp = Icons[config.props.icon as keyof typeof Icons];
+
+  const iconsList: { [key: string]: any } = Icons;
   return (
-    visible && (
-      <Icon
-        component={iconComp as React.ForwardRefExoticComponent<any>}
-        style={config.style}
-        {...config.props}
-        data-id={id}
-        data-type={type}
-        onClick={handleClick}
-      />
-    )
+    visible &&
+    React.createElement(iconsList[config.props.icon], {
+      style: config.style,
+      ...config.props,
+      'data-id': id,
+      'data-type': type,
+      onClick: handleClick,
+    })
   );
 };
 export default forwardRef(MImage);
diff --git a/packages/editor/src/packages/Basic/Icon/Schema.tsx b/packages/editor/src/packages/Basic/Icon/Schema.tsx
@@ -42,7 +42,7 @@ export default {
   // 组件事件
   events: [
     {
-      value: 'handleClick',
+      value: 'onClick',
       name: '点击事件',
     },
   ],

diff --git a/packages/materials/Basic/Icon/Icon.tsx b/packages/materials/Basic/Icon/Icon.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useImperativeHandle, forwardRef } from 'react';
-import Icon, * as Icons from '@ant-design/icons';
+import * as Icons from '@ant-design/icons';
 import { ComponentType } from '../../types';
 /**
  *
@@ -34,9 +34,14 @@ const MIcon = (
     onClick?.();
   };
 
-  const iconComp = Icons[config.props.icon as keyof typeof Icons];
+  const iconsList: { [key: string]: any } = Icons;
   return (
-    visible && <Icon component={iconComp as React.ForwardRefExoticComponent<any>} style={config.style} {...config.props} onClick={handleClick} />
+    visible &&
+    React.createElement(iconsList[config.props.icon], {
+      style: config.style,
+      ...config.props,
+      onClick: handleClick,
+    })
   );
 };
 export default forwardRef(MIcon);