Ion-router-outlet has a default animation?

I tried to navigate between to pages home page -> game page then in my home page i have a when i click the card then the page won’t animate instead it will reload the page before going to game page. So i asked if ion-router-outlet has a default animate when using href properties and is it normal that if i clicked the page it will also reload the current page before entering the next page? If yes then why mine not working. I’m sorry i’m just a beginner in this framework. I’m using ionic 5 and vue 3. Thanks for the respond.

Here is the screenshot:

Card component

Routes

You should use the router-link property on ion-card rather than an href. Using an href typically will cause a full page reload and can interfere with the animations in ion-router-outlet:

<ion-card class="learn" :button="true" color="primary" router-link="/game">
  ...
</ion-card>
1 Like