this.$router.push可以生效的vue-router版本

Question

methods:{
    toUser(){
      console.log('to_user')
      this.$router.push({ path: '/Home' });
      
    },

vue2中this.$router.push不生效，而换成this.$router.replace可以正常起作用

Answer 1

在 Vue.js 中，this.$router.push 和 this.$router.replace 这两个方法主要的区别是是否会向 history 栈中添加新的记录。使用 this.$router.push 会添加一个新的 history 记录，而使用 this.$router.replace 则会替换掉当前的 history 记录。

如果你在 Vue.js 2 中遇到了 this.$router.push 不生效但 this.$router.replace 可以正常起作用的问题，那么可能的原因有：

1. 你可能已经在当前的路由地址，this.$router.push 正在尝试导航到的地址也是当前地址。由于路由没有发生改变，因此看起来 this.$router.push 没有生效。而 this.$router.replace 会替换当前的 history 记录，因此即使目标地址和当前地址一样，你也可以看到页面发生了刷新。

2. 可能存在导航守卫，例如 beforeRouteEnter、beforeRouteUpdate 或 beforeRouteLeave，并且在其中某个阶段调用了 next(false)，会导致导航被阻止。这可能是看起来 this.$router.push 没有工作的原因。

3. VueRouter 本身的错误，你可以尝试升级 VueRouter 到最新版本，或者检查是否有任何 VueRouter 的已知错误。