Pardon my absolute ignorance, I’m new to React, but how can I use slots in Ionic React since React has no directives, like Angular? I mean, lets say I’m wanting to add some FontAwesome Icons but since they don’t have the slot attribute, how can I slot them in a IonButton “start” slot?
Should I create a custom component for slotting? If so, how is that possible in Ionic?
You can use the <IonIcon> component with a custom SVG. As an Ionic component, <IonIcon> supports slots just like <IonButton>.
According to the documentation on IonIcon:
To use a custom SVG, provide its url in the src attribute to request the external SVG file. The src attribute works the same as in that the url must be accessible from the webpage that's making a request for the image. Additionally, the external file can only be a valid svg and does not allow scripts or events within the svg element.
Font Awesome has an SVG variant which you could use with <IonIcon> as a custom SVG as described above.
