Vue3 useRoute() useRouter()的区别

4 min read

在 Vue3 中，useRoute() 和 useRouter() 都是 Vue Router 4 中的两个新的 Composition API。

  • useRoute()：用于在组件中访问当前路由的路由对象。它返回一个响应式的 RouteLocationNormalized 对象，包含当前路由的各种信息，比如 path、params、query 等。

  • useRouter()：用于在组件中访问 Vue Router 的路由实例。它返回一个 Router 对象，通过该对象可以进行路由导航，包括跳转到其他路由、动态修改路由地址等。

总结：

  • useRoute() 提供了一种简便的方式访问当前路由对象的各种信息，可以在组件中直接使用，不需要额外的操作。
  • useRouter() 则提供了对路由实例的访问，可以进行一些复杂的操作，比如动态修改路由地址、跳转到其他路由等。需要明确地导入 Router 对象并使用。