vue-router路由钩子

路由跳转前或跳转后，也就是进入或离开某一个路由的前、后，需要做某些操作，这时就可以使用路由钩子来监听路由的变化。

 

接收三个参数：

• to: Route: 即将要进入的目标路由对象
  

• from: Route: 当前导航正要离开的路由

• next: Function: 一定要调用该方法来 resolve 这个钩子。执行效果依赖 next 方法的调用参数。

 

全局路由钩子：(router/index.js 或 main.js)

router.beforeEach((to, from, next) => {
  //会在任意路由跳转前执行，next一定要执行，否则路由不能跳转 console.log(to,from); // next(); }); // router.afterEach((to, from) => { //会在任意路由跳转后执行 console.log('afterEach'); });

单个路由钩子：（router/index.js）
只有beforeEnter，在进入前执行，to参数就是当前路由

routes: [
    {
      path: '/foo',
      component: Foo,
      beforeEnter: (to, from, next) => { //会在当前路由跳转前执行，next一定要执行，否则路由不能跳转
　　　　next();

　　} } ]

转载于:https://www.cnblogs.com/zhaoxiaoying/p/9351454.html