[X] I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
v8.x
Current Behavior
If the ion-tab-bar component is extracted as a standalone Vue component, it does not change the route and is basically broken after the v8.3.0/v8.3.1 update.
Expected Behavior
Works as expected, even when used as a standalone component, like before version v8.3.0/v8.3.1.
In folders 8.2.9, 8.2.9-standalone, and 8.3.0, you'll see the tabs and the route change correctly. However, in 8.3.0-standalone, the tab visually changes, but the route does not.
The reproduce projects was created using ionic start myApp tabs. Only the versions of @ionic/vue and @ionic/vue-router were fixed to reproduce the bug. The only file modified was src/views/TabsPage.vue, and the only newly created file was src/components/TabBar.vue. Everything else remains the same as in the "tabs" starter template.
Prerequisites
Ionic Framework Version
v8.x
Current Behavior
If the
ion-tab-bar
component is extracted as a standalone Vue component, it does not change the route and is basically broken after the v8.3.0/v8.3.1 update.Expected Behavior
Works as expected, even when used as a standalone component, like before version v8.3.0/v8.3.1.
Steps to Reproduce
Folder Information:
✅ 8.2.9: The
ion-tab-bar
is in views/TabsPage.vue and it works.✅ 8.2.9-standalone: The
ion-tab-bar
is extracted as-is to components/TabBar.vue and it works.✅ 8.3.0: The
ion-tab-bar
is in views/TabsPage.vue and it works.❌ 8.3.0-standalone: The
ion-tab-bar
is extracted as-is to components/TabBar.vue and it doesn't work. That's the bug.Steps to Reproduce
npm run dev
in each folder individually.http://localhost:5173/
.Code Reproduction URL
https://github.com/ozgurg/ionic-8.3.0-ion-tab-bar-vue-component-reproduce
Ionic Info
Additional Information
The reproduce projects was created using
ionic start myApp tabs
. Only the versions of@ionic/vue
and@ionic/vue-router
were fixed to reproduce the bug. The only file modified wassrc/views/TabsPage.vue
, and the only newly created file wassrc/components/TabBar.vue
. Everything else remains the same as in the "tabs" starter template.