Back button click issue on IOS Material Design F7-vue webpack and cordova

Questions
1

Hi.

I have a strange behavior only on IOS, my android App is deployed and everything work well (link : here )

The problem :
For exemple I have 4 pages : Index, A, B, C

From the Index page, I navigate to A then B then C, when I click on the Back button it return on the page A or index .

I have tested many tips gave on different questions such as : stackPages: true

Here is :

  • Router config :
    export default [ { path: '/accueil/', component: Home, name:'Accueil', tabs: [ { path: '/', id: 'tab1', component: Accueil, }, { path: '/tab3/', id: 'tab3', component: Services }, { path: '/tab4/', id: 'tab4', component:Notifications }, { path: '/tab5/', id: 'tab5', component: CompteClient, }, ] }, { path: '/candidatures/', component: Candidature, name:'candidatures', options: { transition: 'f7-push', } }, { path: '/filieres/', component: Filieres, name:'filieres' }, { path: '/filiere/:id/', component: Filiere, name:'filiere', options: { transition: 'f7-fade', } } ]

  • main.vue

    `

<f7-app :params="f7params" name="home">
<f7-view url="/accueil/" :main="true" :reload-pages="false" class="safe-areas" 
:master-detail-breakpoint="800">
</f7-view>
</f7-app>
</template>`

  • Back button code :

    <f7-navbar back-link="Back"> </f7-navbar>

Please I need help I have spent the last week trying to solve this issue.

2

Can you create a minimal reproduction example using template from here How to ask a good question on forum