//钩子 登录拦截

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. Jmeter使用SSL（HTTPS协议）

    Jmeter是apache一款开源.小巧的性能测试工具,平时测试web http协议经常使用,其实jmeter同样支持ssl.方法如下: 需要装有目标网站证书的密钥库,即testclient.keys ...

  2. IO流 -字符输入输出流，以及异常处理方法

    字符输入流 java.io.Reader: 字符输入流的顶层抽象父类 共性的成员方法: int read() 读取单个字符,并返回. int read(char[] cbuf) 将字符读入数组. ab ...

  3. SpringBoot 使用logback

    1.添加pom引用 <dependency> <groupId>ch.qos.logback</groupId> <artifactId>logback ...

  4. Pycharm 修改项目名称后 中括号中出现先前名称怎么解决？

    这时候,你打开工程的路径,会找到一个隐藏文件, .idea  目录删掉他,重新导入Pycharm 就行了. idea记录了一些工程项目信息. 步骤: 1.退出当前工程 2.打开工程路径删除.ideal ...

  5. 【洛谷p1190】接水问题

    接水问题[题目链接] 咱也不知道为啥咱就是想写博客emmm 尽管这个题是2010年的普及组但是我太菜了并不会写emm 其实感觉这道题是纯纯正正的大模拟: 算法标签中的贪心是没有意义的啊?? SOLUT ...

  6. VS2015+QT环境配置后，Lauch Qt Designer打开失败，无法打开*.ui文件

    最近在VS2015上配置QT时出现了这个问题,遂百度其解决方法,解决之后记录下来.第一步: 在[解决方案资源管理器]中,右击你的 xxx.ui文件,选择[打开方式],此时列表中默认值是[ Qt des ...

  7. Mysql 数据库存储的原理？？

    储存过程是一个可编程的函数,它在数据库中创建并保存.它可以有 SQL 语句和一些特殊的控制结 构组成.当希望在不同的应用程序或平台上执行相同的函数,或者封装特定功能时,存储过程是非常有用的.数据库中的 ...

  8. HTML5-video(播放暂停视频；打开关闭声音；进度条)

    <!DOCTYPE html> <html> <head> <title>HTML5-video(播放暂停视频:打开关闭声音:进度条)</titl ...

  9. JavaScript ES6 Promise对象

    说明 Node.js中,以异步(Async)回调著称,使用了异步,提高了程序的执行效率,但是,代码可读性较差的. 假如有几个异步操作,后一个操作需要前一个操作的执行完毕之后返回的数据才能执行下去,如果 ...

  10. 安装Erlang使用RabbitMQ

    首先登陆官网进行下载:https://www.erlang.org/downloads/20.3 本次下载的版本是20.3,rabbitmq准备使用3.7.17版本 现在开始安装 因为是使用c#语言, ...