vue 路由钩子函数

 Vue:router的beforeEach与afterEach钩子函数

路由钩子是在路由变化时使用者可以执行的函数

Vue.beforeEach(function(to,form,next){}) /*在跳转之前执行*/

Vue.afterEach(function(to,form))/*在跳转之后判断*/

router.beforeEach((to, from, next) => {
    // to 是要跳转的路由
    // from   是现在的路由  意思为从什么页面到什么页面
    //next:Function,进行管道中的一个钩子，如果执行完了，则导航的状态就是 confirmed （确认的）；否则为false，终止导航。
}));

路由钩子又分为三类 

全局路由钩子  判断所有页面跳转的路由 

组件路由钩子  beforeRouteEnter 进入组件之前执行的函数   beforeRouteUpdate 组件内更新hash后面的路由了  

eforeRouteLeave 离开这个路由（返回或者跳转到别的页面）

    methods:{
      success:function(){
        this.$router.push({ path: '/chat' });
      },
    },
    computed:{

    },
    beforeRouteEnter:function(to,from,next){
      console.log("进入当前组件");
      next()
    },
    beforeRouteUpdate:function(to,from,next){
      console.log("更新组件（切换tab 修改#后面的值）");
      next()
    },
    beforeRouteLeave:function(to,from,next){
      console.log("离开这个组件");
      next()
    },

某个路由的路由钩子

const router = new VueRouter({  //router/index.js
  routes: [ 
    {
      path: '/login',
      component: Login,
      beforeEnter: (to, from, next) => {
        // ...
      },
      beforeLeave: (to, from, next) => {
        // ...
      }
    }
  ]
})