vue 路由守卫
router.beforeEach((to, from, next) => {
const nextRoute = [ 'login'];
var token = window.localStorage.token;
if(token > 0 ){
next();
}else{
// next({ path: '/login', replace: true, query: { noGoBack: true } })
if (nextRoute.indexOf(to.name) == 0) { // 在免登录白名单,直接进入
next(); //记得当所有程序执行完毕后要进行next(),不然是无法继续进行的;
}else{
next({ path: '/login', replace: true })
}
}
})
这个写在router.js页面export default router上面就可以 nextRoute 白名单地址
判断token是否大于0,是的话,代表token存在,是登陆过的,可以next();正常打开页面,否则就跳到登陆页面。
这个是拿token来判断,用别的修改if判断的条件就可以
vue 路由守卫的更多相关文章
- react router @4 和 vue路由 详解(八)vue路由守卫
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 13.vue路由守卫 a.beforeEach 全局守卫 (每个路由调用前都会触发,根据 ...
- vue路由守卫用于登录验证权限拦截
vue路由守卫用于登录验证权限拦截 vue路由守卫 - 全局(router.beforeEach((to, from, next) =>来判断登录和路由跳转状态) 主要方法: to:进入到哪个路 ...
- vue路由守卫应用,监听是否登录
路由跳转前做一些验证,比如登录验证,是网站中的普遍需求. 对此,vue-route 提供的 beforeRouteUpdate 可以方便地实现导航守卫(navigation-guards). 导航守卫 ...
- Vue路由守卫(跳转页面置顶的处理方)
在用Vue 框架开发时,在电脑调试没有任何问题,但是用手机调试时会发现页面跳转的不对.就是跳转时页面展示的滑动位置不对,会保留上次跳转页面时的跳转位置.因此需要对页面的路由跳转进行优化,需要用到Vue ...
- Vue | 路由守卫面试常考
前言 最近在整理基础,欢迎掘友们一起交流学习 结尾有彩蛋哦! Vue Router 路由守卫 导图目录 路由守卫分类 全局路由守卫 单个路由守卫 组件路由守卫 路由守卫执行的完整过程 路由守卫分类 全 ...
- vue路由守卫
路由守卫 //路由进来之时 beforeRouteEnter(to, from, next) { console.log(this, 'beforeRouteEnter'); // undefined ...
- vue路由守卫触发顺序
不同组件之间的路由跳转流程图 导航被触发(A–>B) 调用A组件内路由守卫beforeRouteLeave(to,from,next) 调用全局路由前置守卫router.beforeEach(t ...
- vue路由守卫+cookie实现页面跳转时验证用户是否登录----(二)设置路由守卫
上一篇我们已经封装好了cookie方法,登录成功之后也可以吧用户信息存到cookie中,接下来需要在router/index.js中引入一下cookie.js文件 然后继续添加以下代码 /* * be ...
- Vue路由守卫之路由独享守卫
路由独立守卫,顾名思义就是这个路由自己的守卫任务,就如同咱们LOL,我们守卫的就是独立一条路,保证我们这条路不要被敌人攻克(当然我们也得打团配合) 在官方定义是这样说的:你可以在路由配置上直接定义 ...
- Vue路由守卫之组件内路由守卫
beforeRouteEnter,进入路由前.需要注意这里不能使用this,因为我们使用的是进入路由之前,那会组件还没创建,得不到this这个属性,所有我们只能使用过vm异步语句来让 ...
随机推荐
- [Codeforces Round #438][Codeforces 868C. Qualification Rounds]
题目链接:868C - Qualification Rounds 题目大意:有\(n\)个题目,\(k\)个人,每个人可能做过这\(n\)个题里的若干道,出题方要在这\(n\)个题目里选若干个出来作为 ...
- 中文乱码总结之JSP乱码
一.JSP中文乱码问题 JSP页面的汉字显示为乱码,而英文和阿拉伯数字正常. 二.原因 汉字编码时用的字符集 与解码用的字符集不一致:所有的字符集都兼容ASCII码,所以英文.数字不存在乱码. 编号 ...
- Hibernate-day02
OID 1,对象里面没有主键的概念,对象中对应主键的属性,称为OID(对象标识符);2,OID用来唯一标明一个对象实体(加上对象类型)3,OID在对象里面不见得只有一个属性;(映射复合主键)4,OID ...
- 使用Eureka作为springcloud的注册机
使用springcloud做项目的负载均衡,需要导的jar这里不再显示,具体配置如下: 作为被注册服务配置: 启动多台服务端就可以实现集群,相应的localhost需要转成真实的ip 当然一个项目还要 ...
- v-for同时循环一个对象和数组
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- Autohotkey常用命令
//输入密码#1::send test1234sleep 600send {enter}return //打开程序; win + t: open total cmd#t::IfWinNotExist ...
- Tengine+Lua+GraphicsMagick
狂神声明 : 文章均为自己的学习笔记 , 转载一定注明出处 ; 编辑不易 , 防君子不防小人~共勉 ! 使用 Tengine+Lua+GraphicsMagick 实现图片自动裁剪缩放 需求 : 图片 ...
- Swagger插件netcore配置
步骤一. Nuget Packages安装,使用程序包管理器控制台,安装命令:Install-Package Swashbuckle.AspNetCore -Pre 步骤二. 在Startup 文件中 ...
- Java面试题和解答(四)
1.JVM什么情况下会GC,GC策略有哪些 当应用程序分配新的对象,GC的代的预算大小已经达到阈值,比如GC的第0代已满:代码主动显式调用System.GC.Collect():其他特殊情况,比如,系 ...
- 玩转PIL >>> 玩转photo
前:1.使用图片放在文件最后,需要的请自行下载 2.运行环境win10家庭版,已经安装好pillow库 一.学习总结 PIL库支持图像的储存,显示和处理,几乎能处理所有的图片格式,可以完成对图像的缩放 ...