vue路由

记录是为了更好的成长！

 

1、组件内的守卫

在vue页面中需要获取页面的前一个页面，所以查询到组件内守卫的方法来做，页面示例如下：

<template>
    <div>
        
    </div>
</template>
<script>
export default {
  data() {
    return {
        oldUrl:''
    }
  },
  // 在渲染该组件的对应路由被 confirm 前调用
  beforeRouteEnter (to, from, next){
    let that = this
     next(vm => {
       // 通过 `vm` 访问组件实例,将值传入oldUrl
       vm.oldUrl = from.path
     })
  },
  mounted() {
    this.$nextTick(()=>{
       // 验证是否获取到了上页的url
      console.log("mounted:"+this.oldUrl)   //输出上一个页面的url
    })
  },
  methods: {
    
  },
  
}
</script>
<style>
</style>

可以查看 vue官方组件内守卫地址

 

以上内容代表个人观点，仅供参考，不喜勿喷。。。