vue-router的next()方法

1.next():进入管道中的下一个钩子。如果全部钩子已经执行完毕,则导航的状态就是confirmed(确认的)

2.next(false):中断当前的导航。如果URL改变了(可能是用户手动输入或者浏览器后退),那么URL地址会重置到from路由对应的地址

3.next('/')或者next({path: '/'}):跳转到一个不同的地址。当前的导航被中断,然后进行一个新的导航。可以向next传递任意对象,允许设置诸如{replace:true,name:'home'}之类的选项以及任何用在router-link的toProp或router.push中的选项。

4.next(error)如果传入的是next的参数是个error实例,则导航会被终止且该错误会被传递给router.onError()注册过的回调

//全局前置路由
router.beforeEach((to, from, next) => {
  if(to.path=='/style'){
    next(false)
    return
  }
  NProgress.start();
  next();
});
router.afterEach(() => {
  NProgress.done();
});

如上述代码块,注册一个全局路由守卫。

当需要从'from'跳转至'to'时,路由守卫会监控到这一举动,若不执行next(),则相当于没有放行,会依然留在from对应的路由。只有当执行了next()之后,才会进行跳转。

posted @ 2023-06-06 23:33  槑孒  阅读(3452)  评论(0)    收藏  举报