vue3 路由跳转的所有方式一一列举

好的，以下是 Vue 3 中路由跳转的几种方式：

1. 声明式导航（router-link）：使用 `<router-link>` 组件实现路由跳转，可以通过 to 属性指定目标路由地址。

2. 编程式导航：使用 `$router.push()`、`$router.replace()`、`$router.go()` 等方法实现路由跳转。其中，`$router.push()` 和 `$router.replace()` 可以传递一个路由对象，也可以传递一个字符串路径。

3. 命名路由：在定义路由时，可以为每个路由指定一个名称，然后在编程式导航时使用 `$router.push({ name: 'xxx' })` 的方式进行跳转。

4. 带参数的路由：在定义路由时，可以通过使用冒号（:）来指定参数，例如：`{ path: '/user/:id', component: User }`。然后在路由跳转时，可以通过 `$router.push('/user/123')` 或 `$router.push({ path: '/user/123' })` 的方式传递参数。

5. 嵌套路由：在定义路由时，可以通过 children 属性来定义子路由，从而实现嵌套路由。在编程式导航时，需要使用相应的子路由路径进行跳转。

6. 路由守卫：在路由跳转前、跳转后、以及跳转过程中可以执行一些逻辑，例如：检查用户是否登录、记录页面访问日志等。Vue 3 中提供了全局路由守卫（beforeEach、beforeResolve、afterEach）和局部路由守卫（beforeEnter）两种方式。