Vue关于beforeRouteEnter以及beforeRouteLeave函数的运用

发布时间 2023-04-24 21:04:37作者: 软工小蜗牛

先上代码

beforeRouteEnter:(to,from,next)=>{

    console.log("进入路由之前")
    next(vm =>{
      vm.getData();
    });
  },
  beforeRouteLeave:(to,from,next)=>{
      console.log("进入路由之后")
      next();
  },
  methods:{
    getData:function (){
      this.axios({
        method:"get",
        url:"http://localhost:8081/static/mock/data.json"
      }).then(function (response){
        console.log(response)
      })
    }
  }

我们可以看到beforeRouteLeave有三个固定的参数,也就是to,from,next,

对于参数next,我们可以对他进行操作

next也是一个函数,我们传递不同的参数会有不同的效果

 

还有一点,如果我们想要去掉路径上的*号,可以在router配置中的

mode属性选择history