How can i implement router animation in ionic-vue

Please any one can give me basic example. In the docs there’s no Vue code snippet only angular and react. Please help.

And whats the different between ion-nav and ion-router-outlet please give me sample on how can i implement this on my project. Please please please. I’m so beginner on this framework.

I added Vue examples to the animation docs: https://ionicframework.com/docs/utilities/animations. You might need to do a hard refresh in your browser to see the changes.

The difference between router outlet and nav is mentioned in the docs: https://ionicframework.com/docs/api/nav

Unlike Router Outlet, Nav is not tied to a particular router. This means that if we load a Nav component, and push other components to the stack, they will not affect the app’s overall router. This fits use cases where you could have a modal, which needs its own sub-navigation, without making it tied to the apps URL.

You should use ion-router-outlet when you want to navigate to pages using a router. You should use ion-nav when you want to transition to pages outside of the routing context. For example, you would use ion-nav to transition to multiple pages inside of an ion-modal because ion-modal is not linked to the router.

3 Likes