How to correctly use routing with Vue in Ionic

twestrick · December 3, 2021, 1:23pm

Here is Tabs.vue from Ionic’s starter project for reference - starters/Tabs.vue at 2f146baf52afcf87deb028547192152c42438437 · ionic-team/starters · GitHub

notflip · December 3, 2021, 2:34pm

@twestrick I saw that example, I did see that is being used twice, once in the App.vue, and once in the Tabs.vue, is that intended?

twestrick · December 3, 2021, 2:41pm

I’m assuming you are referring to the ion-router-outlet. Having it in ion-tabs is now required in v6 but also works in v5 (I added it in prepping for v6).

Reference: Ionic v6 Breaking Changes

notflip · December 3, 2021, 2:53pm

That’s what I saw in the docs, however I wasn’t sure if this had to be the only or not, so it’s okay to have it repeated in multiple places? Since in the examples the App.vue also has it.

twestrick · December 3, 2021, 2:56pm

Yes, both should have it. From my understanding and limited knowledge, the one in Tabs is used to handle the tab views specifically. The one in App is used for all other pages outside of tabs.