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')