vue3怎么配置路由

在Vue 3中配置路由需要使用Vue Router库。下面是配置Vue 3路由的步骤：

1. 首先，确保你的项目已经安装了Vue Router。可以使用以下命令进行安装：

npm install vue-router@next

2. 在你的Vue项目的入口文件（通常是main.js）中，导入Vue Router并使用它：

import { createApp } from 'vue'
import { createRouter, createWebHistory } from 'vue-router'
import App from './App.vue'

const router = createRouter({
  history: createWebHistory(),
  routes: [
    // 在这里定义你的路由
  ]
})

const app = createApp(App)
app.use(router)
app.mount('#app')

3. 在`routes`数组中定义你的路由。每个路由都是一个对象，包含`path`和`component`属性。`path`指定URL路径，`component`指定对应的组件。例如：

const routes = [
  { path: '/', component: Home },
  { path: '/about', component: About },
  // 其他路由...
]

4. 在你的Vue组件中使用路由。可以使用`<router-link>`组件创建链接，使用`<router-view>`组件显示对应的组件。例如，在App.vue中：

<template>
  <div>
    <router-link to="/">Home</router-link>
    <router-link to="/about">About</router-link>
    <router-view></router-view>
  </div>
</template>

这样就完成了Vue 3的路由配置。