vue路由元之进入路由需要用户登录权限功能
为什么需要路由元呢???
博猪最近开发刚刚好遇到一个情况,就是有个路由页面里面包含了客户的信息,客户想进这个路由页面的话,
就可以通过请求数据获取该信息,但是如果客户没有登录的话,是不能进到该页面的,于是我们就用到路由元了。
我们在router.js里面配置:
const router = new VueRouter({
routes: [
{
path: '/foo',
component: Foo,
meta: {unLogin: true} //这里配置meta作为标识,unLogin为true的话,就需要用户的登录权限
}
]
})
router.beforeEach((to, from, next) => {
if (!to.meta.unLogin) { // 判断该路由是否需要登录权限
if (localStorage.getItem('userMsg')) { //localStorage.getItem('userMsg')是登录后本地保存登录的信息,只有已登录才有
next();
}
else {
next({
path: '/user/login',
query: {redirect: to.fullPath} // 将跳转的路由path作为参数,登录成功后跳转到该路由
})
}
}
else {
next();
}
});
OK,以上就是路由元的使用方法。
************************ END ************************
vue路由元之进入路由需要用户登录权限功能的更多相关文章
- flask 开发用户登录注册功能
flask 开发用户登录注册功能 flask开发过程议案需要四个模块:html页面模板.form表单.db数据库操作.app视图函数 1.主程序 # app.py # Auther: hhh5460 ...
- springmvc拦截器实现用户登录权限验证
实现用户登录权限验证 先看一下我的项目的目录,我是在intellij idea 上开发的 1.先创建一个User类 package cn.lzc.po; public class User { pri ...
- Java Spring+Mysql+Mybatis 实现用户登录注册功能
前言: 最近在学习Java的编程,前辈让我写一个包含数据库和前端的用户登录功能,通过看博客等我先是写了一个最基础的servlet+jsp,再到后来开始用maven进行编程,最终的完成版是一个 Spri ...
- springMVC中实现用户登录权限验证
通过上网搜资料显示,使用filter和interceptor都可以实现.不过推荐使用interceptor. 下面就使用Interceptor实现用户登录权限验证功能. 拦截器需要实现Inceptor ...
- JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)
一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBean模式(MVC)适合开发复杂的web应用,在这种模式下,servlet负责处理用户请求,jsp ...
- vue进阶:vue-router之导航守卫、路由元信息、路由懒加载
1.导航被触发 2.在失活的组件里调用离开守卫:beforeRouteLeave —— 组件内守卫(离开组件). 3.调用全局的beforeEach守卫 —— 全局守卫(进入组件). 4.在重用组件里 ...
- SpringMVC+Apache Shiro+JPA(hibernate)案例教学(二)基于SpringMVC+Shiro的用户登录权限验证
序: 在上一篇中,咱们已经对于项目已经做了基本的配置,这一篇文章开始学习Shiro如何对登录进行验证. 教学: 一.Shiro配置的简要说明. 有心人可能注意到了,在上一章的applicationCo ...
- html页面通过http访问mysql数据库中的内容,实现用户登录的功能
需求: 通过html编写用户登录页面,页面内容包括用户名.密码和登录按钮,点击登录后访问login.php文件,使用按钮默认的submit提交用户名和密码,在login.php中访问mysql数据库, ...
- 利用PHP连接数据库——实现用户登录注册功能以及管理员对用户注册的审核功能
1.用户注册页面 页面效果: 代码如下: <!DOCTYPE html><html> <head> <meta charset=" ...
随机推荐
- Rescue BFS+优先队列 杭电1242
思路 : 优先队列 每次都取最小的时间,遇到了终点直接就输出 #include<iostream> #include<queue> #include<cstring> ...
- [转+自]关于PHP7的新特性(涉及取反和disabled_functions绕过)
PHP7和PHP5上的安全区别 preg_replace()不再支持/e修饰符 利用\e修饰符执行代码的后门大家也用了不少了,具体看官方的这段描述: 如果设置了这个被弃用的修饰符, preg_repl ...
- 硬盘性能测试工具之bonnie++
bonnie++ 官方站点 先写内存的两倍,内存较大时比较耗时.适合简单的测试场景. # bonnie++ -u root 写测试 读测试 Version 1.97 ------Sequential ...
- Android--sos闪光灯
Camera camera = null; Parameters parameters = null; Handler handler = new Handler() { @Override publ ...
- Python学习17之类3继承
'''''''''继承:在继承原有类功能的基础上,增加新的功能(属性或者方法),形成新的类被继承的类:父类新的类:子类 格式:class 子类(父类) class 子类(父类1,父类2,父类3...) ...
- [Windows] 如何用编程的方式格式化硬盘
If memory serves, you're looking for SHFormatDrive(). Use the Format method of the Win32_Volume clas ...
- Spring Cloud 系列之 Stream 消息驱动(二)
本篇文章为系列文章,未读第一集的同学请猛戳这里:Spring Cloud 系列之 Stream 消息驱动(一) 本篇文章讲解 Stream 如何实现消息分组和消息分区. 消息分组 如果有多个消息消费者 ...
- Swoole 实战:MySQL 查询器的实现(协程连接池版)
目录 需求分析 使用示例 模块设计 UML 类图 入口 事务 连接池 连接 查询器的组装 总结 需求分析 本篇我们将通过 Swoole 实现一个自带连接池的 MySQL 查询器: 支持通过链式调用构造 ...
- event兼容性解决
event出现undefind错误 解决方法: $('#normalImgDiv').mousemove(function (e) { var e = window.event || e; var p ...
- Netty(一):ByteBuf读写过程图解
我们知道ByteBuf通过读写两个索引分离,避免了NIO中ByteBuffer中读写模式切换时,需要flip等繁琐的操作. 今天就通过一段测试代码以及图例来直观的了解下ByteBuf中的readInd ...