diff --git a/packages/react-router/src/ReactRouter/RouteManagerContext.ts b/packages/react-router/src/ReactRouter/RouteManagerContext.ts index 3430937edb..b63a830bd0 100644 --- a/packages/react-router/src/ReactRouter/RouteManagerContext.ts +++ b/packages/react-router/src/ReactRouter/RouteManagerContext.ts @@ -1,4 +1,3 @@ -import { NavDirection } from '@ionic/core'; import React, { ReactNode } from 'react'; import { ViewStacks } from './ViewStacks'; @@ -9,7 +8,6 @@ export interface RouteManagerContextState { viewStacks: ViewStacks; setupIonRouter: (id: string, children: ReactNode, routerOutlet: HTMLIonRouterOutletElement) => Promise; removeViewStack: (stack: string) => void; - transitionView: (enteringEl: HTMLElement, leavingEl: HTMLElement, ionRouterOuter: HTMLIonRouterOutletElement, direction: NavDirection) => void; } export const RouteManagerContext = /*@__PURE__*/React.createContext({ @@ -17,8 +15,7 @@ export const RouteManagerContext = /*@__PURE__*/React.createContext { navContextNotFoundError(); }, hideView: () => { navContextNotFoundError(); }, setupIonRouter: () => Promise.reject(navContextNotFoundError()), - removeViewStack: () => { navContextNotFoundError(); }, - transitionView: () => { navContextNotFoundError(); } + removeViewStack: () => { navContextNotFoundError(); } }); function navContextNotFoundError() { diff --git a/packages/react-router/src/ReactRouter/Router.tsx b/packages/react-router/src/ReactRouter/Router.tsx index b0842b8476..2c438b71e2 100644 --- a/packages/react-router/src/ReactRouter/Router.tsx +++ b/packages/react-router/src/ReactRouter/Router.tsx @@ -31,8 +31,7 @@ class RouteManager extends React.Component v.prevId === view.id); viewsToRemove.forEach(v => { - this.removeOrphanedViews(v, viewStack); - // If view is not currently visible, go ahead and remove it from DOM - if (v.ionPageElement!.classList.contains('ion-page-hidden')) { - v.show = false; - v.ionPageElement = undefined; - v.isIonRoute = false; - v.prevId = undefined; - v.key = generateId(); + // Don't remove if view is currently active + if (v.id !== this.activeIonPageId) { + this.removeOrphanedViews(v, viewStack); + + // If view is not currently visible, go ahead and remove it from DOM + if (v.ionPageElement!.classList.contains('ion-page-hidden')) { + v.show = false; + v.ionPageElement = undefined; + v.isIonRoute = false; + v.prevId = undefined; + v.key = generateId(); + } + v.mount = false; } - v.mount = false; }); } @@ -249,21 +259,21 @@ class RouteManager extends React.Component { - this.transitionView(enteringEl, leavingEl, ionRouterOutlet, direction); + this.transitionView(enteringEl, leavingEl, ionRouterOutlet, direction, showGoBack); }, 10); } } - private async commitView(enteringEl: HTMLElement, leavingEl: HTMLElement, ionRouterOuter: HTMLIonRouterOutletElement, direction?: NavDirection) { + private async commitView(enteringEl: HTMLElement, leavingEl: HTMLElement, ionRouterOuter: HTMLIonRouterOutletElement, direction?: NavDirection, showGoBack?: boolean) { if (enteringEl === leavingEl) { return; @@ -273,7 +283,7 @@ class RouteManager extends React.Component