Setting up navigation links with RouterLink
As we know, RouterView oversees rendering the correct active view content relative to the URL path; RouterLink, on the other hand, oversees mapping the routes to navigable links. RouterLink is a Vue component that helps users navigate within an app with routing enabled. RouterLink by default renders an anchor tag, <a>, with a valid href link generated by its to prop.
In our example app generated by Vite, since there are two routes pre-populated, there are also two RouterLink instances added to the <template> section of App.vue as the header navigation menu:
<nav> Â Â <RouterLink to="/">Home</RouterLink> Â Â <RouterLink to="/about">About</RouterLink> </nav>
Since we are using the web history mode with createWebHistory(), the to prop of each RouterLink should receive an identical value with the path property declared in the targeted route object (as...
