fix(vue): improve path matching with tabs (#22807)

resolves #22519
This commit is contained in:
Liam DeBeasi
2021-01-22 10:19:38 -05:00
committed by GitHub
parent e2d8e5c4dc
commit 2a3ce9a74e
5 changed files with 100 additions and 18 deletions

View File

@ -22,16 +22,16 @@ export const createViewStacks = (router: Router) => {
viewItem.ionRoute = true;
}
const findViewItemByRouteInfo = (routeInfo: RouteInfo, outletId?: number) => {
return findViewItemByPath(routeInfo.pathname, outletId);
const findViewItemByRouteInfo = (routeInfo: RouteInfo, outletId?: number, useDeprecatedRouteSetup: boolean = false) => {
return findViewItemByPath(routeInfo.pathname, outletId, false, useDeprecatedRouteSetup);
}
const findLeavingViewItemByRouteInfo = (routeInfo: RouteInfo, outletId?: number, mustBeIonRoute: boolean = true) => {
return findViewItemByPath(routeInfo.lastPathname, outletId, mustBeIonRoute);
const findLeavingViewItemByRouteInfo = (routeInfo: RouteInfo, outletId?: number, mustBeIonRoute: boolean = true, useDeprecatedRouteSetup: boolean = false) => {
return findViewItemByPath(routeInfo.lastPathname, outletId, mustBeIonRoute, useDeprecatedRouteSetup);
}
const findViewItemByPathname = (pathname: string, outletId?: number) => {
return findViewItemByPath(pathname, outletId);
const findViewItemByPathname = (pathname: string, outletId?: number, useDeprecatedRouteSetup: boolean = false) => {
return findViewItemByPath(pathname, outletId, false, useDeprecatedRouteSetup);
}
const findViewItemInStack = (path: string, stack: ViewItem[]): ViewItem | undefined => {
@ -44,7 +44,7 @@ export const createViewStacks = (router: Router) => {
})
}
const findViewItemByPath = (path: string, outletId?: number, mustBeIonRoute: boolean = false): ViewItem | undefined => {
const findViewItemByPath = (path: string, outletId?: number, mustBeIonRoute: boolean = false, useDeprecatedRouteSetup: boolean = false): ViewItem | undefined => {
const matchView = (viewItem: ViewItem) => {
if (
(mustBeIonRoute && !viewItem.ionRoute) ||
@ -54,7 +54,13 @@ export const createViewStacks = (router: Router) => {
}
const resolvedPath = router.resolve(path);
const findMatchedRoute = resolvedPath.matched.find((matchedRoute: RouteLocationMatched) => matchedRoute === viewItem.matchedRoute && (path === viewItem.pathname || matchedRoute.path.includes(':')));
let findMatchedRoute;
// TODO: Remove in Ionic Vue v6.0
if (useDeprecatedRouteSetup) {
findMatchedRoute = resolvedPath.matched.find((matchedRoute: RouteLocationMatched) => matchedRoute === viewItem.matchedRoute && (path === viewItem.pathname || matchedRoute.path.includes(':')));
} else {
findMatchedRoute = resolvedPath.matched.find((matchedRoute: RouteLocationMatched) => matchedRoute === viewItem.matchedRoute);
}
if (findMatchedRoute) {
return viewItem;