javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-17 02:31:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(vue): correctly render child pages in tabs (#22141)

Browse Source
This commit is contained in:
Liam DeBeasi
2020-09-22 14:41:26 -04:00
committed by GitHub
parent 6ac6810148
commit 7e449a1ca6
2 changed files with 30 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/vue/src/components/IonRouterOutlet.ts
View File

@ -16,13 +16,27 @@ import { fireLifecycle, generateId, LIFECYCLE_DID_ENTER, LIFECYCLE_DID_LEAVE, LI
let viewDepthKey: InjectionKey<0> = Symbol(0);
export const IonRouterOutlet = defineComponent({
name: 'IonRouterOutlet',
setup() {
setup(_, { attrs }) {
const vueRouter = useRouter();
const route = useRoute();
const depth = inject(viewDepthKey, 0);
// TODO types
const matchedRouteRef: any = computed(() => route.matched[depth]);
let tabsPrefix: string | undefined;
const matchedRouteRef: any = computed(() => {
const matchedRoute = route.matched[depth];
if (attrs.tabs && !tabsPrefix) {
tabsPrefix = route.matched[0].path;
viewStacks.addTabsPrefix(tabsPrefix);
}
if (matchedRoute && attrs.tabs && route.matched[depth + 1]) {
return route.matched[route.matched.length - 1];
}
return matchedRoute;
});
provide(viewDepthKey, depth + 1)
@ -205,6 +219,10 @@ export const IonRouterOutlet = defineComponent({
}
const currentRoute = ionRouter.getCurrentRouteInfo();
const hasTabsPrefix = viewStacks.hasTabsPrefix(currentRoute.pathname)
const isLastPathTabs = viewStacks.hasTabsPrefix(currentRoute.lastPathname);
if (hasTabsPrefix && isLastPathTabs && !attrs.tabs) { return; }
let enteringViewItem = viewStacks.findViewItemByRouteInfo(currentRoute, id);
if (!enteringViewItem) {