这两天做项目的时候，碰到产品提的一个需求，每次进到首页都要刷新，但是需要根据上一页路由的path的地址对首页里的内容进行不同的操作。

实现方式并不复杂，主要是利用 beforeRouteEnter 这个钩子中的from参数获得之前url的信息，然后给 next 传递回调来访问当前组件的实例，至于为什么不直接利用 this 访问组件实例，是因为beforeRouteEnter 守卫不能访问 this（beforeRouteEnter 守卫在导航确认前被调用，因此即将登场的新组件还没被创建）。

核心代码：

data(){
  return {
    fromPath:''
  }
},
beforeRouteEnter (to, from, next){
  next(vm => {
    // 通过 `vm` 访问组件实例,将值传入fromPath
    vm.fromPath = from.path
  })
},
mounted(){
  this.$nextTick(()=>{
    // 验证是否获取到了上页的url
    /* eslint-disable no-console */
    console.log(this.fromPath)
  })
}

本人前端程序员，长期混迹于各种前端开发中，现在专门为前端热爱者建了个微信群，和大家一起分享自己在工作、学习中遇到的技术知识或问题，还有各种资料和课程，各位感兴趣的可以加入哦~