无法在离子反应项目中创建动态离子图标

如何解决无法在离子反应项目中创建动态离子图标

我在项目中使用了许多组件，所有这些组件中的每个组件都需要不同的ionIcon。所以我创建了Icon组件。图标名称从每个父组件传递到Icon子组件。但是它没有验证。

**

<Icon name="closeCircleOutline" /> \\ this is the parent component

图标组件

import { IonIcon,IonItem } from "@ionic/react";
 import * as iconName from "ionicons/icons";
export default function Icon(props: any) { 
var propsIcon = props.name; // icon name passed from parent component
return <IonIcon icon={iconName.propsIcon}></IonIcon>; 
}

'typeof类型的属性'propsIcon'不存在 import（“ /用户/ dubaiTradeit /桌面/移动 Apps / Ionic / lastMile / node_modules / ionicons / icons / index“）' 以上警告我得到了

解决方法

我认为您打算编写以下代码

return <IonIcon icon={iconName.props}></IonIcon>;

您引用的是图标库中不存在的“ propsIcon”，而不是“ props”。希望这可以解决您的问题。