• 导航守卫


    导航守卫就是路由跳转过程中的一些钩子函数,这个过程中触发的这些函数能让你操作一些其它事情时,可以进行过滤操作,这就是导航守卫。

    ² 全局守卫

    # 全局前置守卫  路由规则文件中定义

    //当一个导航触发时,触发前置守卫,

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

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

    next: Function: 一定要调用该next方法,否则路由不向下执行。

    router.beforeEach((to, from, next) => {

      // ...

    })

     

    # 全局后置钩子

    // 此钩子不会接受 next 函数也不会改变导航本身

    router.afterEach((to, from) => {

      // ...

    })

    ² 组件内守卫

    你可以在路由组件内直接定义以下路由导航守卫

    const Foo = {

      template: `...`,

      beforeRouteEnter (to, from, next) {

        // 在渲染该组件的对应路由被 confirm 前调用

        // 不!能!获取组件实例 `this`

        // 因为当守卫执行前,组件实例还没被创建

      },

      beforeRouteUpdate (to, from, next) {

        // 在当前路由改变,但是该组件被复用时调用

        // 举例来说,对于一个带有动态参数的路径 /foo/:id,在 /foo/1 /foo/2 之间跳转的时候,

        // 由于会渲染同样的 Foo 组件,因此组件实例会被复用。而这个钩子就会在这个情况下被调用。

        // 可以访问组件实例 `this`

      },

      beforeRouteLeave (to, from, next) {

        // 导航离开该组件的对应路由时调用

        // 可以访问组件实例 `this`

      }

    }

    右侧打赏一下 代码改变世界一块二块也是爱
  • 相关阅读:
    LeetCode 977 有序数组的平方
    LeetCode 24 两两交换链表中的节点
    LeetCode 416 分割等和子集
    LeetCode 142 环形链表II
    LeetCode 106 从中序与后序遍历序列构造二叉树
    LeetCode 637 二叉树的层平均值
    LeetCode 117 填充每个节点的下一个右侧节点
    LeetCode 75 颜色分类
    redhat 7.4 挂载ntfs格式的u盘并且使用
    redhat 查看CPU frequency scaling(CPU频率缩放)
  • 原文地址:https://www.cnblogs.com/ht955/p/14252701.html
Copyright © 2020-2023  润新知