Thanks for the post! Learning how to use Ionic with React myself. Quick question though, what is the reasoning behind having both, functional and class based components? Then only exporting the function?
export default ({closeAction, text}: { closeAction: Function, text: string }) => ( <MyModal closeAction={closeAction} text={text}> </MyModal> )
Couldn't you just export a functional component at that point like this?
export default const ModalComponent: React.FC<MyModalProps> = ({ closeAction, text }) => ( <> <IonHeader> <IonToolbar color="primary"> <IonTitle>My Modal</IonTitle> <IonButtons slot="end"> <IonButton onClick={() => closeAction()}> <IonIcon name="close" slot="icon-only"></IonIcon> </IonButton> </IonButtons> </IonToolbar> </IonHeader> <IonContent className="ion-padding"> <p>{text}</p> </IonContent> </> );
Absolutely no particular reason, you are right, both functional or class based components work fine for this use case.
Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink.
Hide child comments as well
Confirm
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Thanks for the post! Learning how to use Ionic with React myself. Quick question though, what is the reasoning behind having both, functional and class based components? Then only exporting the function?
Couldn't you just export a functional component at that point like this?
Absolutely no particular reason, you are right, both functional or class based components work fine for this use case.