diff --git a/packages/react-router/src/ReactRouter/IonRouter.tsx b/packages/react-router/src/ReactRouter/IonRouter.tsx
index a21d53c045..fcadd6561a 100644
--- a/packages/react-router/src/ReactRouter/IonRouter.tsx
+++ b/packages/react-router/src/ReactRouter/IonRouter.tsx
@@ -187,8 +187,15 @@ class IonRouterInner extends React.PureComponent<IonRouteProps, IonRouteState> {
           routeInfo.lastPathname = currentRouteInfo?.pathname || routeInfo.lastPathname;
           routeInfo.prevRouteLastPathname = currentRouteInfo?.lastPathname;
           routeInfo.pushedByRoute = pushedByRoute;
-          routeInfo.routeDirection = currentRouteInfo?.routeDirection || routeInfo.routeDirection;
-          routeInfo.routeAnimation = currentRouteInfo?.routeAnimation || routeInfo.routeAnimation;
+
+          /**
+           * When replacing routes we should still prefer
+           * any custom direction/animation that the developer
+           * has specified when navigating first instead of relying
+           * on previously used directions/animations.
+           */
+          routeInfo.routeDirection = routeInfo.routeDirection || currentRouteInfo?.routeDirection;
+          routeInfo.routeAnimation = routeInfo.routeAnimation || currentRouteInfo?.routeAnimation;
         }
 
         this.locationHistory.add(routeInfo);