vue-router使用next()跳转到指定路径时会无限循环

这个是转载的，我也遇到过这种错误，https://www.cnblogs.com/yuwenjing0727/p/9916691.html

我在路由为 /path 的页面这样写，这个是组件路由，我想实现的效果是在这个页面点击浏览器的返回按钮后要返回 /home页面而不是上一个页面，下面代码就一直死循环

// 下面的写法会死循环
     beforeRouteLeave (to, from, next) {
        console.log('离开路路由')
       next('/home')
}

正确写法

beforeRouteLeave (to, from, next) {
        console.log('离开路路由')
       if(to.fullPath==='/home'){
         next();
       }else{
         next('/home')
       }

 

我不太明白为什么会死循环，我在home页面也没有写任何钩子函数来跳到result页面啊，我也没有写全局的beforeEach钩子函数。
上面第一段代码是可用的，自己瞎摸索出来的，但是不是很明白为什么要加那个判断？

后来经过查阅资料得知vue-router的next()方法无参和有参时是不一样的

现在，算是大致理解了，当执行钩子函数时如果遇到next('/home')等时会中断当前导航，
比如当前导航是去/a,那么遇到next('/home')后就会把to.path改为/home，然后会重新触发这个离开的钩子，
注意：此时会重新触发执行这个钩子，而不是在这个钩子函数继续执行的，之前是一直没理解这里，
以为是执行next('/home')后就会直接跳到home页面呢，当重新触发后就会继续执行next('/home')所以会一直循环
。至于解决办法就是判断下，如果已经是/home了就next()。

总结一下，就是next('/home')会中断当前导航，遇到next('/home')后就会把 to.path 改为 /home, 重新当前钩子，如果没有遇到 next() 则会进入到无限循环。