2024年4月5日发(作者：)

在Vue3中，路由的编写主要包括以下几个步骤：

1. 安装并导入Vue Router：首先，需要安装Vue Router。可以通过npm或yarn进行安装。例如，使用

npm的命令是

npm install vue-router

。然后，在需要使用路由的Vue文件中，导入Vue Router并添

加到Vue实例中。

2. 创建路由：在Vue Router中，需要创建路由对象，并定义路由的路径和组件。可以使用

createRouter

方法创建路由对象，然后通过

addRoute

方法添加路由。例如：

javascript

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

import Home from './views/'

const router = createRouter({

history: createWebHistory(),

routes: [

{ path: '/', component: Home }

]

})

在上面的代码中，创建了一个路由对象，定义了一个路径为“/”的路由，组件为Home。

复制代码

3. 配置路由：在Vue Router中，可以通过配置文件来配置路由。在Vue项目的根目录下创建一个名为

或

router/

的文件，并在其中配置路由。例如：

javascript

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

import Home from '../views/'

import About from '../views/'

const routes = [

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

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

]

const router = createRouter({

history: createWebHistory(),

routes

})

export default router

在上面的代码中，定义了两个路由，分别为“/”和“/about”，分别对应组件Home和About。

复制代码

4. 使用路由：在需要使用路由的Vue文件中，可以使用

useRouter

方法获取路由对象，并使用路由对象的方

法进行导航。例如：

复制代码

javascript

import { useRouter } from 'vue-router'

const router = useRouter()

// 导航到Home页面

('/')

复制代码