Ionic life cycle not working as expected when we create blank project for ionic-react

I tried to use react lifecycles both through Class component and function component but useIonViewWillLeave and useIonViewDidLeave is not fired when we create blank project in ionic react and navigate to another component using simple link or history.push methods.

I’m using @ionic/react version 5.0.7

import { IonContent, IonPage, useIonViewWillEnter, useIonViewDidEnter, useIonViewWillLeave, useIonViewDidLeave, IonItem, IonList, IonLabel, IonTabBar, IonTabButton, IonIcon} from '@ionic/react';
import React, {  FC } from 'react';
import { useHistory, Link } from 'react-router-dom';

const Vendor: FC = () => {
    const history = useHistory();
    const gotoHome = () => {
      history.push('/address')
    }
   useIonViewWillEnter(() =>{
     console.log('IonViewWillEnter - vendor');
   })
  
   useIonViewDidEnter(() => {
    console.log('IonViewDidEnter- vendor');
   });

   useIonViewWillLeave(() =>{
    console.log('IonViewWillLeave -vendor');
   });
  
   useIonViewDidLeave(()=>{
    console.log('IonViewDidLeave -vendor');
   });
   
    return (
  
      <IonPage>
         
        <IonContent fullscreen>
            vendor page

            <Link to="/address" className="btn btn-primary">got to home using link</Link>
            
            <h1 onClick ={gotoHome} >go to home</h1>
      </IonContent>
      </IonPage>
    );
  };
  
  export default Vendor;

and at the time of leaving the current page useIonViewDidEnter and useIonViewWillEnter triggered again.

1 post - 1 participant

Read full topic