diff --git a/packages/react-router/src/ReactRouter/StackManager.tsx b/packages/react-router/src/ReactRouter/StackManager.tsx
index f67eb75afd..c1c7067c1b 100644
--- a/packages/react-router/src/ReactRouter/StackManager.tsx
+++ b/packages/react-router/src/ReactRouter/StackManager.tsx
@@ -112,7 +112,12 @@ export class StackManager extends React.PureComponent node matching the current route info.
+ * If no can be matched, a fallback node is returned.
+ */
+function findRouteByRouteInfo(node: React.ReactNode, routeInfo: RouteInfo) {
let matchedNode: React.ReactNode;
+ let fallbackNode: React.ReactNode;
+ // nodes are rendered inside of a node
const routesNode = findRoutesNode(node) ?? node;
React.Children.forEach(routesNode, (child: React.ReactElement) => {
+ // Ignore any non- nodes
if (child.type === Route) {
const match = matchPath({
pathname: routeInfo.pathname,
componentProps: child.props,
});
+
if (match) {
matchedNode = child;
}
- }
- });
- if (matchedNode) {
- return matchedNode;
- }
- // If we haven't found a node
- // try to find one that doesn't have a path or from prop, that will be our not found route
- React.Children.forEach(routesNode, (child: React.ReactElement) => {
- if (child.type === Route) {
if (!(child.props.path || child.props.from)) {
- matchedNode = child;
+ // If we haven't found a node
+ // try to find one that doesn't have a path or from prop, that will be our not found route
+ fallbackNode = child;
}
}
});
- return matchedNode;
+ return matchedNode ?? fallbackNode;
}
function matchComponent(node: React.ReactElement, pathname: string, forceExact?: boolean) {