diff --git a/packages/react-router/src/ReactRouter/StackManager.tsx b/packages/react-router/src/ReactRouter/StackManager.tsx index e000008aef..c21e6e6d51 100644 --- a/packages/react-router/src/ReactRouter/StackManager.tsx +++ b/packages/react-router/src/ReactRouter/StackManager.tsx @@ -206,8 +206,18 @@ export class StackManager extends React.PureComponent { ionLifeCycleContext!: React.ContextType; context!: React.ContextType; ionRouterOutlet: HTMLIonRouterOutletElement | undefined; + outletIsReady: boolean; constructor(props: OutletPageManagerProps) { super(props); + + this.outletIsReady = false; } componentDidMount() { if (this.ionRouterOutlet) { - componentOnReady(this.ionRouterOutlet, () => { - this.context.registerIonPage(this.ionRouterOutlet!, this.props.routeInfo!); - }); + /** + * This avoids multiple raf calls + * when React unmounts + remounts components. + */ + if (!this.outletIsReady) { + componentOnReady(this.ionRouterOutlet, () => { + this.outletIsReady = true; + this.context.registerIonPage(this.ionRouterOutlet!, this.props.routeInfo!); + }); + } this.ionRouterOutlet.addEventListener( 'ionViewWillEnter',