minimal reproduction: https://github.com/peixin/ionic5-vue3-ts-example
preview: https://ionic5-vue3-ts-example.vercel.app/
Why does Ionic vue have nested ion-page tags that cause common component like float button in ion-page routing to be rendered twice?
pages structure:
ion-tabs[Course]
→ ion-page course index [simple route vue]
→ ion-page navigation page [child route]
ion-page course index
<ion-page data-test="course-index">
<router-view />
..... other common component
</ion-page>
ion-page navigation page
<template>
<ion-page data-test="navigation-page">
<ion-content>
Test
</ion-content>
</ion-page>
</template>
now the other common component will be render twice
“@ionic/vue”: “5.9.4”,
“@ionic/vue-router”: “5.9.4”,