0

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

Eann
  • 83
  • 2
  • 12
  • 1
    You should import it, where you use it, otherwise it cant find, my suggestion is that find dynamic importing ionicon library – Ferhat BAŞ Sep 29 '20 at 10:45

1 Answers1

1

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.

Srikanth
  • 26
  • 1