i am using many components in my project and in all those components need different different ionIcon for each component. So i created Icon component. Icon name passed from each parent components to the Icon child component. But its not validating.
**
<Icon name="closeCircleOutline" /> \\ this is the parent component
Icon 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>;
}
Property 'propsIcon' does not exist on type 'typeof import("/Users/dubaitradeit/Desktop/Mobile Apps/Ionic/lastMile/node_modules/ionicons/icons/index")' the above warning iam getting
I think you meant to write the below code
return <IonIcon icon={iconName.props}></IonIcon>;
Instead of referring to 'props' you referred to 'propsIcon' which is not-existent in icons library. Hope this rectifies your issue.