vue3引入router

vue3引入router

在Vue 3中引入Vue Router可以通过以下步骤完成：

一、安装Vue Router：

npm install vue-router@4

二、在你的Vue 3项目中创建一个router.js文件，并设置Vue Router：

// router.js

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

// 引入Vue组件

import HomePage from './components/HomePage.vue';

import AboutPage from './components/AboutPage.vue';

// 定义路由

const routes = [

  { path: '/', component: HomePage },

  { path: '/about', component: AboutPage },

];

// 创建router实例

const router = createRouter({

  history: createWebHistory(),

  routes,

});

export default router;

在 main.js中引入并使用router实例：

import { createApp } from 'vue'

import App from './App.vue'

import router from './router';//引入路由组件

const app = createApp(App)

app.use(router);

app.mount('#app')