Navigating between routes
Until now, we have learned how to create our routes and how to navigate through them by loading the URL directly in the browser. In this section, we will learn how to navigate between different routes directly in the code base.
It is true that we could define our navigation using a simple <a> tag, but that will force the app to fully reload on any navigation and so will go against the whole architecture of a SPA, which offers a “reload-free” experience.
To solve this issue, vue-router offers components and methods that will handle navigations without reloading the page.
While using vue-router, navigation can be achieved in two different ways. One uses a component called <router-link> while the other is triggered programmatically using router.push(). Let’s see both methods in action and learn when to use them.
Using the <router-link> component
Using the <router-link> component to navigate within your...
