vue this.$router 的用法

this.$router 在 Vue.js 中是一个非常有用的实例属性，它代表了 Vue Router 的实例。通过这个实例，你可以访问到路由的多种功能，比如编程式导航、获取当前路由信息等。以下是一些 this.$router 的用法示例：

1. 编程式导航

编程式导航是 Vue Router 提供的另一种导航方式，与 <router-link> 组件的声明式导航相对。你可以使用 this.$router.push 或 this.$router.replace 方法来实现编程式导航。

// 使用 push 方法导航到不同的 URL，这个方法会向 history 栈添加一个新的记录  
this.$router.push('/some-path');  
  
// 或者使用对象  
this.$router.push({ path: '/some-path' });  
  
// 使用 name，如果路由配置了 name  
this.$router.push({ name: 'someRouteName', params: { userId: 123 }});  
  
// 使用 replace 方法，它不会向 history 添加新记录，而是替换掉当前的 history 记录  
this.$router.replace('/some-path');

2. 导航守卫

虽然 this.$router 本身不直接用于定义导航守卫，但它是实现导航守卫的关键。在 Vue Router 中，你可以使用全局守卫、路由独享的守卫、组件内的守卫来守卫导航。这些守卫可以基于用户权限、路由状态等条件决定是否允许导航。