Vue提供了两个对象来实现路由功能：router和router和route。在使用Vue Router时，许多人会有疑问：router和router和route到底有什么区别？

$router

$router是Vue Router的实例，包含了整个路由器的配置信息，可以理解为全局的路由控制器。它提供了一些方法和属性，列如push、replace和go等方法，用于改变URL，以及currentRoute、matched等属性，用于获取路由相关信息。

javascript复制代码javascript复制代码
export default {
  methods: {
    goToPage() {
      // 使用$router.push来改变URL
      this.$router.push('/page')
    }
  }
}

$route

$route是当前激活的路由对象，包含了当前URL解析得到的信息。也就是说，每次改变URL时，$route都会更新。

$route对象有许多属性，列如path表明当前路径，query表明查询参数，params表明动态路由参数，还有hash、fullPath等属性，可以根据具体需要来使用。

javascript复制代码javascript复制代码
export default {
  created() {
    console.log(this.$route.path) // 输出当前路径
    console.log(this.$route.params.id) // 输出动态路由参数id
  }
}

区别

综上所述，router是Vue Router的实例，提供了路由控制器的一些方法和属性，用于改变URL和获取路由相关信息。而router是VueRouter的实例，提供了路由控制器的一些方法和属性，用于改变URL和获取路由相关信息。而route是当前激活的路由对象，包含了当前URL解析得到的信息。

因此，它们之间最大的区别就在于作用范围：router是全局的，router是全局的，route是局部的。在使用时，需要根据具体需要来选择使用哪个对象。

原文：
https://juejin.cn/post/7225524569506414653