Router is enabling us to use vue app as different URL enabled , such as one of Home, About etc. It is not a new feature, it exists in react, angular etc.
Virtually router turn single page vuejs app into multi page app, in reality these pages are components (known for developers, not the end user). When the user click on the link Vuejs simply switching between these components.
Vue Router
By adding a Vue router to our app Vue will create additional folder structure , a router, view and configuration files.
View and Router
Views are page components ( url such as /about), which can be consisting of other components to. You can create additional pages as you wish and should configure on the router file.
New Vue project with router
In the CLI command we can specify whether want to use router on not, that is it.
For existing non router project
For existing non router projects it is possible to add router, but be careful that the app.vue file will be replaced by the vue CLI. So copy the content to clipboard or another file and move it back when the process is completed.
Issue the following command to add router using the vue CLI.
vue add router // say no to history
That is all you know about router,
The following vue post posts may help you
- Integrate Hygraph with Svelte, React, Vue - Hygraph headless CMS integration samples
- Integrate Contentful in Vue 3 - Integrate Contentful CMS in Vue 3, can be done using Graphql as well as the contentful library. We go with npm package. Install the dependency by running the command yarn add contentful in terminal. The client We can a create client module in order to make contentful queries. Replace the space and accessToken with your … Continue reading "Integrate Contentful in Vue 3"
- How to build a blog using Nuxt 3 and Graphql - How to build a blog app using TailwindCSS + Nuxt 3 + Graphql API
- Editor frameworks for JS apps - About Javascript Editor frameworks
- Prisma MongoDB connection - How to configure MongoDB (local and Cloud based ) in Prisma ORM
- How to create build tool enabled Vue project in 10 second - How to create a build tool enabled Vue project in 10 second
- Prismic-CMS-Nuxt slice rendering - Prismic-CMS-Nuxt slice rendering example
- Prismic-CMS-Nuxt store - Prismic-CMS-Nuxt store example
- Vue Tag snippet - Vue Tag (Google Analytic) implementation snippet
- Nuxt apollo-graphql server with Apollo and Express - Nuxt apollo-graphql server with Apollo, Express, and Prisma using serverMiddleware