vue

vue-router有哪几种导航钩子（ 导航守卫 ）？

发布于 2021-01-11 17:02:34
关注者
0
被浏览
654
举报
6 个回答
  • 面试哥
    面试哥 2021-01-12
    为面试而生，有面试问题，就找面试哥。

    三种导航钩子：
    1.全局导航钩子：router.beforeEach(to,from,next) 作用：跳转前进行判断拦截
    2.组件内的钩子
    3.单独路由独享组件

  • 面试哥
    面试哥 2021-01-12
    为面试而生，有面试问题，就找面试哥。

    共有三种守卫：
    1：全局守卫：beforeEach,afterEach
    2:路由独享守卫：beforeEnter
    3:组件级别的守卫beforeRouteEnter,beforeRouteUpdate,beforeRouteLeave
    他们执行顺序：全局》路由》组件
    除了afterEach全局后置外，其他的守卫中务必要调用next(),否则无法完成导航
    还有注意全局前置守卫可以用来进行拦截，（登录拦截）

  • 面试哥
    面试哥 2021-01-12
    为面试而生，有面试问题，就找面试哥。

    ickt-5:
    https://www.cnblogs.com/kzxiaotan/p/11676872.html

  • 面试哥
    面试哥 2021-01-12
    为面试而生，有面试问题，就找面试哥。
  • 面试哥
    面试哥 2021-01-12
    为面试而生，有面试问题，就找面试哥。
    1. 全局：
      beforeEach((to, from, next) => {调用next来resolve这个钩子} ),
      beforeResolve((to, from, next) => {} ),
      afterEach((to, from) => {} )
    2. 路由独享：
      beforeEnter((to, from, next) => {} ),
    3. 组件内部：
      beforeRouteEnter((to, from, next) => {next可以传回调，回调里面可以用vm访问实例} ), 内部没有this，因为路由还没confirm
      beforeRouteUpdate((to, from, next) => {})，可以拿到this
      beforeRouteLeave((to, from, next) => {})
知识点
面圈网VIP题库

面圈网VIP题库全新上线，海量真题题库资源。 90大类考试，超10万份考试真题开放下载啦

去下载看看