//钩子 登录拦截

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

const sessionToken = window.sessionStorage.getItem("token");

if(to.path === '/' || to.path === '/Login') {

    next();

} else {//在这里可以做一些路由判断哦

    if(sessionToken !=''&&sessionToken !='null'&&sessionToken !=null) {

       next();

    } else {

       next('/Login');

    }

}

})

vue中的导航钩子的更多相关文章

  1. Vue-router中的导航钩子

    vue-router中的导航钩子,主要用来作用是拦截导航,让他完成跳转或取消.(路由守卫) 原文指路:https://blog.csdn.net/weixin_41399785/article/det ...

  2. 【11】vue router 之导航钩子

    导航钩子 vue-router 提供的导航钩子主要用来拦截导航,让它完成跳转或取消.有多种方式可以在路由导航发生时执行钩子:全局的, 单个路由独享的, 或者组件级的.http://www.jiansh ...

  3. 通俗理解vue路由的导航钩子中关于next()

    1 背景:你乘坐汽车从A景区想赶往B景区(模拟路由A跳转到路由B) 1.next() 你乘坐汽车要从A景区到B景区,路过关卡时,守门人拦下你,你量出了next(),守门人一看没问题,赶紧放行,于是你顺 ...

  4. vue中的导航守卫

    官方文档地址: 导航守卫:https://router.vuejs.org/zh-cn/advanced/navigation-guards.html 好的,重点内容 router.beforeEac ...

  5. Vue中的导航守卫（路由守卫）

    当做Vue-cli项目的时候感觉在路由跳转前做一些验证,比如登录验证,是网站中的普遍需求. 对此,vue-router 提供的 beforeEach可以方便地实现全局导航守卫(navigation-g ...

  6. vue中父子组件钩子的执行顺序

    我们已经非常熟悉单个的vue组件的生命周期执行顺序了,但是,如果有嵌套组件,父子组件的生命周期的执行顺序是什么? 当父子组件在加载的时候,执行的先后顺序为 父beforeCreate -> 父c ...

  7. vue中 左侧导航条 多个toggleClass

    <ul> <li v-for='item in items' @click="showToggle(item)"> <i :class="{ ...

  8. vue-router导航钩子

    Vue路由中的导航钩子,可以用来拦截导航,让它完成跳转. 全局导航钩子 当一个导航触发时,全局的 before 钩子按照创建顺序调用.钩子是异步解析执行,此时导航在所有钩子 resolve 完之前一直 ...

  9. 5分钟学会vue中的路由守卫(导航守卫)

    在项目开发中每一次路由的切换或者页面的刷新都需要判断用户是否已经登录,前端可以判断,后端也会进行判断的,我们前端最好也进行判断. vue-router提供了导航钩子:全局前置导航钩子 beforeEa ...

随机推荐

  1. Reverse Linked List（反转单向链表）

    来源:https://leetcode.com/problems/reverse-linked-list Reverse a singly linked list. 递归方法:递归调用直到最后一个节点 ...

  2. C#中Func与Action的理解

    Action 与 Func是.NET类库中增加的内置委托,以便更加简洁方便的使用委托.最初使用委托时,均需要先定义委托类型,然后定义一个符合委托类型签名的函数,在调用前,需声明并创建委托对象,将指定函 ...

  3. Good number(3进制)

    https://codeforces.com/problemset/problem/1249/C2 C2. Good Numbers (hard version) time limit per tes ...

  4. Codeforces 1042C (贪心+模拟)

    题面 传送门 分析 思路简单,但代码较复杂的贪心 分类讨论: 有0 负数有奇数个:将绝对值最小(实际最大)的负数和0全部乘到一起,最后删掉0 负数有偶数个:将0全部乘到一起,最后删掉0 没有0 负数有 ...

  5. 生产者消费者模型(JoinableQueue)

  6. SQLServer查看及设置最大连接数

    很多时候自己本地开发会遇到 ,打开几个连接正常访问 之后就报错误,这时候需要调整sqlserver 最大连接数. 1. 查询最大连接数 SELECT value_in_useFROM sys.conf ...

  7. service worker介绍

    原文:Service workers explained 译者:neal1991 welcome to star my articles-translator, providing you advan ...

  8. Linux基于Hadoop2.8.0集群安装配置Hive2.1.1及基础操作

    前言 安装Apache Hive前提是要先安装hadoop集群,并且hive只需要在hadoop的namenode节点集群里安装即可,安装前需保证Hadoop已启(动文中用到了hadoop的hdfs命 ...

  9. nginx的RPM包制作案例

    使用nginx-1.12.2版本的源码软件,生成对应的RPM包软件,具体如下: - 软件名称为nginx - 软件版本为1.12.2 - RPM软件包可以查询描述信息 - RPM软件包可以安装及卸载 ...

  10. 如何查看Codeforces的GYM中比赛的数据

    前置条件:黄名(rating >= 2100) 或者 紫名(rating >= 1900)并且打过30场计分的比赛. 开启:首先打开GYM的界面,如果符合要求会在右边展示出一个Coach ...