How do I set up Vue Router in my Vue.js application?

How do I set up Vue Router in my Vue.js application?

To set up Vue Router, first install it using npm: npm install vue-router. Then, create a router instance and define your routes.

Can you show me an example of defining routes?

Sure! Here's a simple example:

import { createRouter, createWebHistory } from 'vue-router';

const routes = [
  { path: '/', component: Home },
  { path: '/about', component: About }
];

const router = createRouter({
  history: createWebHistory(),
  routes,
});

export default router;

What do I need to do after defining the routes?

After defining the routes, you need to add the router to your Vue instance. In your main.js file, import the router and pass it to the Vue app.

Can I use dynamic routes with Vue Router?

Yes, you can use dynamic routes! You can define a route with a parameter like this: { path: '/user/:id', component: User }. This allows you to access the id parameter in your component.