zoukankan      html  css  js  c++  java
  • vue学习指南:第十四篇(详细)

    导航守卫

    一、全局导航守卫

    1. 全局导航守卫,把方法给 router,只要路由发生改变跳转都会触发这个函数

    2. 每个路由 都有一个 meta

    3. 全局导航守卫分两种:

      1. 全局前置导航守卫:路由还没有跳转之前

      2. 全局后置导航守卫:路由跳转之后

      3. to 和 from 都是 router

      3.1 to 即将跳转的路由

      3.2 from 跳转之后的路由

      4. next 函数 必须调用,不写所有的 路由 就没法跳转

    4. 全局前置导航守卫:路由跳转前 执行这个方法

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

    5. 全局后置导航守卫:路由跳转后会执行这个方法,它没有 next函数。路由跳转之后会执行这个方法

    router.afterEach ((to, from) => {
      console.log("路由跳转后")
    })

    二、路由独享守卫

    1. 某个路由独有的 其它路由没有,只有进入某个路由,才会触发这个路由方法

    三、组件类的守卫

    一、 beforeRouteEnter

    2. 当该组件对应的 路由被渲染时 会执行这个函数

    注意:这个函数不能使用this关键字,因为组件化还没有实例

    二、beforeRouteUpdate

    1. 在当前路由发生改变且该组件被复用的时候

    2. 这种现象只能发生在路由传参上,只有路由传参才会出现路由不同,组件被复用

    三、beforeRouteLeave

    导航离开该组件对应的路由 会执行这个函数

    作者:晋飞翔
    手机号(微信同步):17812718961
    希望本篇文章 能给正在学习 前端的朋友 或 以及工作的朋友 带来收获 不喜勿喷 如有建议 多多提议 谢谢!!!

  • 相关阅读:
    游戏AI系列内容 咋样才能做个有意思的AI呢
    图片缩放的相关处理
    Lua 安全调用 metatable 的简单应用
    让Lua自己把文件夹下面的所有文件自动加载起来吧
    【原创】有利于提高xenomai 实时性的一些配置建议
    环境篇:Docker
    环境篇:Virtualbox+Vagrant安装Centos7
    环境篇:VMware Workstation安装Centos7
    软件篇:前端保姆->VSCode
    大数据篇:ElasticSearch
  • 原文地址:https://www.cnblogs.com/jinfeixiang/p/12175040.html
Copyright © 2011-2022 走看看