Vue 中 route 和 router 的区别？

在 Vue 中，通常使用 Vue Router 来管理应用程序的路由。在这种情况下，route 和 router 是 Vue Router 中的两个重要概念，它们表示不同的概念和功能。

Route（路由对象）

route 是 Vue Router 中的一个对象，表示当前活跃的路由信息。它包含了当前 URL 匹配到的路由信息，包括路由的路径、参数、查询参数、元信息等。route 对象会随着路由的导航而变化，在 Vue 组件中可以通过 $route 访问当前的路由信息。

export default {
  created() {
    console.log(this.route.path); // 当前路由路径
    console.log(this.route.params); // 当前路由参数
    console.log(this.$route.query); // 当前路由查询参数
    // ...
  }
};

Router（路由器）

router 是 Vue Router 的实例，它负责管理应用程序的路由配置、导航等功能。router 实例包含了路由配置信息、路由的匹配规则、路由导航的方法等，可以通过它来进行路由的跳转、导航守卫的注册等操作。

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

const router = new VueRouter({
  routes: [
    // 路由配置信息
    { path: '/', component: Home },
    { path: '/about', component: About }
    // ...
  ]
});

export default router;

总结来说，route 是表示当前活跃的路由信息的对象，而 router 是 Vue Router 的实例，负责整个路由系统的管理和控制，包括路由的配置、匹配、导航等功能。route 是 router 的一个属性，表示当前的路由状态信息。