使用一句三元表达式，
<router-link class="flex-left left" tag="div" :to="loginState?'/loginOut':''">    loginState相当于登录状态的flag，可以从localstrage中获取判断token来判断登录状态
            <img src="../../assets/img/iconfont/unlogo.png" alt="">                    //这里写死，省略了代码，项目中是按实际需求完成的登录和非登录展示不同的logo（默认的logo和用户自己设定的logo）
 </router-link>
使用场景：登录状态下点击头像进入某一页面，未登录状态点击默认logo无法进行路由跳转，
另一种比较正规的方式是在app.vue中使用

watch:{
    $route(to,from){
}
监听路由，路由守卫，用到了在做笔记

记录一个vue路由拦截效果的小技巧的更多相关文章

  1. 记录一个webstorm的设置或者说小技巧

    在 html 的元素中,如果输入属性,默认会填充 引号,在 react 书写中非常不方便. 其中的JSX很多时候是不需要 quotation 的,只是需要一个 括号 {} 即可. 自己找了下webst ...

  2. Vue 路由拦截（对某些页面需要登陆才能访问）

    前言 做项目的时候有个需求,就是发现没有登录,竟然也可以进入我的主页,这样肯定是不能容忍的.于是就要让他进入主页的时候,加个判断是否有登录,若没有登录,则返回登录界面,登录成功后还可以跳转到之前进入的 ...

  3. vue 路由拦截、axios请求拦截

    路由拦截 项目中,有些页面需要登录后才能进入,例如,在某页面A,用户在操作前需要先进入登录页(此时需要将上一页的地址(/survey/start)作为query存入login页面的地址中,如: htt ...

  4. vue 路由拦截器和请求拦截器

    路由拦截器 已路由为导向 router.beforeEach((to,from,next)=>{ if(to.path=='/login' || localStorage.getItem('to ...

  5. 一个 Vue & Node 的全栈小项目

    约学 - 可以寻找一起自习的小伙伴的Web APP 一个基于 Vue & Node 的移动端全栈小项目 在线演示(请使用移动端查看效果) 源码地址: https://github.com/G- ...

  6. (转)一个vue路由参数传递的注意点

    首先我的路由的定义 { path: '/b', name: 'B', component: resolve => require(['../pages/B.vue'], resolve) } 我 ...

  7. 记录一个在制作Swing程序的小怪事

    在制作一个Swing程序时,出现了奇怪的事情,程序在Eclipse里执行正常,但打包后再执行那些动态执行的控件就消失不见了.截图如下: 在Eclipse里正常执行的画面: 打包执行后出现的画面: 可以 ...

  8. beforeRouteLeave 实现vue路由拦截浏览器的需求，进行一系列操作 草稿保存等等

    场景:为了防止用户失误点错关闭按钮等等,导致没有保存已输入的信息(关键信息).用法://在路由组件中: beforeRouteLeave (to, from, next) { if(用户已经输入信息) ...

  9. VUE路由过度效果vs缓存

    app页面 router.js

  10. vue开发必须知道的小技巧

    近年来,vue越来越火,使用它的人也越来越多.vue基本用法很容易上手,但是还有很多优化的写法你就不一定知道了.本文列举了一些vue常用的开发技巧.require.context() 在实际开发中,绝 ...

随机推荐

  1. 替换Spring容器中已经存在的Bean

    一.背景 我们在开发的过程中,经常会引入别人写的jar包实现某些功能.而别人的jar包一般都自动注入Spring容器中,假设别人都是通过@Bean或@Component注入的,并且没有加入@Condi ...

  2. node-xlsx处理excel

    引用node-xlsx npm install node-xlsx -save 文件中引用 const xlsx = require('node-xlsx') 读取excel const sheet ...

  3. SpringBoot 常用注解总结

    核心注解 1. @SpringBootApplication 主要用于开启自动配置,它也是一个组合注解,主要组合了 @SpringBootConfiguration.@EnableAutoConfig ...

  4. KingbaseES参数track_activity_query_size介绍

    背景 同事A在客户现场,最近注意到客户的主数据库性能有所下降,尤其是在高峰时段.怀疑可能有一些复杂的查询影响了数据库的性能,但尚未确定具体是哪些查询. 为了诊断问题,A决定查看高峰期正在执行的查询,先 ...

  5. KingbaseES使用kbbench计算连接耗时

    前言 本文讨论一下KingbaseES数据库中如何计算数据库连接耗时.有这样一个场景,不借助第三方工具,在数据库服务端计算1000个数据库连接的总耗时,并取得每个连接耗时的平均值.怎样实现呢?我们可以 ...

  6. Zotero 插件：DOI Manager 使用

    一.项目信息与下载安装 https://github.com/bwiernik/zotero-shortdoi 根据readme,下载并安装即可.可能访问会失败,多试几次,总是能够成功的. 本博客编写 ...

  7. 如在 Java 中分割 Excel 工作表

    前言 在Excel中创建的大多数商业报告不是单页的文档,而是包含了多个上下文相关的信息,这些信息被存储在多个工作表中.例如我们的一些地区销售报告.按部门分类的员工记录.每家店铺的库存清单等. 然而,随 ...

  8. #分治NTT#CF1218E Product Tuples

    Codeforces 用 OGF 表示 \(F(B,x)\) 就是 \[\prod_{i=1}^n(1+(q-a_i)x) \] 直接分治 NTT 把 \([x^k]\) 也就是这一位的系数求出来就可 ...

  9. C# 字符串操作指南：长度、连接、插值、特殊字符和实用方法

    字符串用于存储文本.一个字符串变量包含由双引号括起的字符集合 示例: // 创建一个string类型的变量并赋予一个值 string greeting = "Hello"; 如果需 ...

  10. C++ 虚函数详解：多态性实现原理及其在面向对象编程中的应用

    在面向对象的编程中,多态性是一个非常重要的概念.多态性意味着在不同的上下文中使用同一对象时,可以产生不同的行为.C++是一种面向对象的编程语言,在C++中,虚函数是实现多态性的关键 什么是虚函数 虚函 ...