fix(vue): ion-tab-bar no longer throws undefined error when re-creating tabs (#22261)

resolves #22255
This commit is contained in:
Liam DeBeasi
2020-10-07 09:37:25 -04:00
committed by GitHub
parent 2bad1bb82e
commit d746561ea2
4 changed files with 33 additions and 11 deletions

View File

@ -1,7 +1,10 @@
<template>
<ion-page>
<ion-page data-pageid="tab1">
<ion-header>
<ion-toolbar>
<ion-buttons>
<ion-back-button default-href="/"></ion-back-button>
</ion-buttons>
<ion-title>Tab 1</ion-title>
</ion-toolbar>
</ion-header>
@ -18,11 +21,11 @@
</template>
<script>
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent } from '@ionic/vue';
import { IonButtons, IonBackButton, IonPage, IonHeader, IonToolbar, IonTitle, IonContent } from '@ionic/vue';
import ExploreContainer from '@/components/ExploreContainer.vue';
export default {
name: 'Tab1',
components: { ExploreContainer, IonHeader, IonToolbar, IonTitle, IonContent, IonPage }
components: { IonButtons, IonBackButton, ExploreContainer, IonHeader, IonToolbar, IonTitle, IonContent, IonPage }
}
</script>

View File

@ -1,5 +1,5 @@
<template>
<ion-page>
<ion-page data-pageid="tabs">
<ion-content>
<ion-tabs>
<ion-tab-bar slot="bottom">
@ -7,12 +7,12 @@
<ion-icon :icon="triangle" />
<ion-label>Tab 1</ion-label>
</ion-tab-button>
<ion-tab-button tab="tab2" href="/tabs/tab2">
<ion-icon :icon="ellipse" />
<ion-label>Tab 2</ion-label>
</ion-tab-button>
<ion-tab-button tab="tab3" href="/tabs/tab3">
<ion-icon :icon="square" />
<ion-label>Tab 3</ion-label>
@ -32,10 +32,10 @@ export default {
components: { IonContent, IonLabel, IonTabs, IonTabBar, IonTabButton, IonIcon, IonPage },
setup() {
return {
ellipse,
square,
ellipse,
square,
triangle,
}
}
}
</script>
</script>