$router 与$routers的区别有哪些，举例说明

在Vue.js的Router中，通常会遇到`$router`和`$routers`这两种写法，但实际上`$router`就是官方推荐使用的统一变量名，它代表了当前应用的路由实例。而`$routers`可能是开发者在某些场景下的误写或者是自定义的别名，但在核心库中是找不到`$routers`的。

以下是`$router`的一般用法：

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

new Vue({
  el: '#app',
  router: new Router({
    routes: [
      { path: '/home', component: HomeComponent }
    ]
  }),
  mounted() {
    console.log(this.$router); // 输出整个路由器实例，包括配置和当前路由信息
  }
});

这里的`this.$router`可以直接访问路由的各种属性和方法，比如导航、获取当前路由等。

至于`$routers`，这通常是不存在的，如果在代码中看到这样的写法，可能是使用者自己在某个地方做了全局的变量赋值，或者误解了API文档。正确的用法应该是始终使用`$router`。

相关问题

this.$router.resolve 传参方式有哪些

在 Vue.js 中，this.$router.resolve() 方法可以用于解析路由地址。以下是 this.$router.resolve() 方法的传参方式：

1. 字符串方式：

   this.$router.resolve('/path/to/route')

2. 对象方式：

   this.$router.resolve({ path: '/path/to/route', query: { key: value } })

3. 命名路由方式：

   this.$router.resolve({ name: 'routeName', params: { key: value } })

其中，第一种方式是最简单的传参方式，直接传入路由地址的字符串即可。第二种方式可以传入一个包含 path 和 query 的对象，用于动态生成路由地址。第三种方式可以传入一个包含 name 和 params 的对象，用于生成命名路由地址。

举实例来说明$route和$router的区别

$route和$router都是Vue.js中与路由相关的概念，但它们的作用和用法不同。

$route是指当前激活的路由信息对象，可以通过$route来获取当前路由的路径、参数、查询参数等信息。例如：

<template>
  <div>
    <h1>{{ $route.path }}</h1>
    <p>参数: {{ $route.params }}</p>
    <p>查询参数: {{ $route.query }}</p>
  </div>
</template>

$router是Vue.js中的路由实例对象，它提供了一些方法和属性来操作路由，比如跳转路由、监听路由变化等。例如：

<template>
  <div>
    <button @click="goHome">返回首页</button>
  </div>
</template>

<script>
export default {
  methods: {
    goHome() {
      this.$router.push('/')
    },
  },
}
</script>

在上述代码中，我们通过$router.push方法来跳转到首页路由。需要注意的是，$router只能在Vue实例中使用，而$route可以在组件中使用。