Page transition with router.replace?

I’m trying to remove history after logging in or logging out. For that, I’m using router.replace instead of router.push.

It works fine, however, there are no page transitions.

Is there any way to have regular page transition (like with router.push) when using router.replace?

Not at the moment. In Ionic v6 we will be adding functionality that lets you do a replace operation with an animation via the new useIonRouter API: Vue Navigation | Ionic Documentation

2 Likes

same for me. I have found the solution to its problem in https://github.com/ionic-team/ionic-framework/issues/22654

But after install, the updated router and I got an Error about onIonViewEnter and Leave not being found.
I used to post the issue to Github, but no one care or any reply. How disappointed, and I didn’t find out my post any more…

Finally, I have to use router.go(-1) for the return page many time or using router beforeLeave and beforeEnter or router guard of vue.

@whitersun Can you link me to the GitHub Issue that you posted?

Hello @ldebeasi,

First thing, I apologize for missing the last post I have posted before.
Actually, I have remembered used to post something like a page transition issue view page from 1-2 months ago, I remembered after installing your update @ionic/vue router
npm install @ionic/vue@5.6.0-dev.202012091649.c699e16 @ionic/vue-router@5.6.0-dev.202012091649.c699e16

I got the error is say onIonViewDidEnter and onIonViewDidLeave is missing. After that moment, I mess up. But fortunately, I found the ionic has a new updated version of about 5.6.13.

That time I must rebuild my project again to the newest version because the last project was broken by the onIonView.
But in the new version 5.6.13 still have the wrong view page transition and after got the wrong view page Devtool has not shown any error.

If you wanna check the router, you can try to push many routers and use replace go to homePage. I believe you will clear the issue of the router.

And the second issue I got is about ion-tab, after a push to the first page and second page. Then go back first page then home page (home > first > second > first > home) then go tab2 and return tab1. At the moment I got the second page without error, it should be the homepage(tab1), not my second page.

and the third issue of the router is ionGoBack:
issue description:
when I push the first page, then the second page, and then the third page. That was still ok, when I return the second page, the history was deleted last page history (is ok).
but from the second page return to the first page, the second page has not been removed from history and then I kept return to the home page, the second page, and the first page was still in history. I believe this is a bug.

(home(record) > first(record) > second(record) > third(current) )
goBack(third(remove) > second(record) > first (record) > home(record))

And I am using default-herf to return specific view page also got a problem when render not my already point the page I want.


that is an issue I got, and I have other issues of ionic, but not relate with this post.
I hope my issue will help ionic vue be better.

Thanks, and I still love using ionic.

Thanks. You mentioned you posted this issue to GitHub, but no one replied. Can you send the link to that GitHub issue?

@ldebeasi, for apologize. I didn’t find it out anymore, it missing now. But that post already solved with new version 5.6.13, so is okay.

But the router may do better, because these was still problem, some time freeze view page, sometimes does not render page or go wrong view page with wrong web address.

Like after click login or register and call api to post to server at the same time, router always go wrong page or render wrong viewpage or maybe sometimes freeze not moving anymore ( this is I checked in my phone, so don’t know what errors occurs). And sometimes router response errors say IonElementViewPage…

I hope in version 6, vue router will gonna gone all problem about router. Becuase Router is the one very important for project to estimate that was stable or not. Thanks and Ciao

Glad to hear one of the issues is resolved in v5.6.13. For any other issues, I definitely recommend filing issues on GitHub with a code reproduction as that is the best way to ensure they get fixed. We are a small team, so it may take us a day or two to reply, but we do read every issue that comes in.