vue 路由权限
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import login from '@/components/login'
import register from '@/components/register'
Vue.use(Router) const router = new Router({
mode: 'history',
routes: [{
path: '/',
name: 'home',
component: HelloWorld,
meta: {
requiresAuth: true
}
},
{
path: '/HelloWorld',
name: 'HelloWorld',
component: HelloWorld,
},
{
path: '/login',
name: 'login',
component: login,
},
{
path: '/register',
name: 'register',
component: register,
},
]
}); //注册全局钩子用来拦截导航
router.beforeEach((to, from, next) => {
//获取store里面的token
let token = store.state.token;
//判断要去的路由有没有requiresAuth
if (to.meta.requiresAuth) {
if (token) {
next();
} else {
next({
path: '/login',
query: { redirect: to.fullPath } // 将刚刚要去的路由path作为参数,方便登录成功后直接跳转到该路由
});
}
} else {
next();
}
});
export default router;
vue 路由权限的更多相关文章
- vue路由权限之访问权限(meta控制是否有访问权限)
首先登录那权限表 router.beforeEach((to, from, next) => { if(to.path === '/login') { next(); }else{ if(!st ...
- vue路由菜单权限设置就button权限设置
路由权限的设计思路: 首先,我们的需要校验权限的路由的 url,全部由后端返回,后端会返回当前用户的路由树数组.前端在进入页面前请求接口,把数据拿到: 其次,前端会维护一个路由映射组件的列表,如果路由 ...
- vue路由守卫用于登录验证权限拦截
vue路由守卫用于登录验证权限拦截 vue路由守卫 - 全局(router.beforeEach((to, from, next) =>来判断登录和路由跳转状态) 主要方法: to:进入到哪个路 ...
- 【vue】vue的路由权限管理
前言: 最近闲来无事浏览各种博客,看到了一个关于路由权限的管理,觉得很有用,针对那个博客,准备自己写一个demo. 实现: 路由大致分为用户路由<特定用户才能浏览>和基本路由<所有用 ...
- React+DvaJS 之 hook 路由权限控制
博客 学院 下载 GitChat TinyMind 论坛 APP 问答 商城 VIP 活动 招聘 ITeye 写博客 发Chat 登录注册 原 React+DvaJS 之 hook 路由权限控制 20 ...
- koa2服务端使用jwt进行鉴权及路由权限分发
大体思路 后端书写REST api时,有一些api是非常敏感的,比如获取用户个人信息,查看所有用户列表,修改密码等.如果不对这些api进行保护,那么别人就可以很容易地获取并调用这些 api 进行操作. ...
- Vue 路由(对路由页面编写做规范)
前言 上一篇写了“Vue 路由拦截(对某些页面需要登陆才能访问)” 的博客,此篇是续上篇对路由页面模块化,可以看到之前的路由配置都写在main.js中,真正开发肯定不能都写在main.js,所以我们要 ...
- Vue路由vue-router
前面的话 在Web开发中,路由是指根据URL分配到对应的处理程序.对于大多数单页面应用,都推荐使用官方支持的vue-router.Vue-router通过管理URL,实现URL和组件的对应,以及通过U ...
- 攻克vue路由
先下手 路由是个好功能,但是每次都感觉没法开始下手,愣愣的看半天官方文档,所以做个快速开始教程. 首先先搭好HTML文件结构: <!--link和view在一个父元素下--> <di ...
随机推荐
- 20多个常用的免费WebService接口
20多个常用的免费WebService接口 天气预报Web服务,数据来源于中国气象局 Endpoint Disco WSDL IP地址来源搜索 WEB 服务(是目前最完整的IP地址数据) Endp ...
- Android ToggleButton(开关函数)与switch (开关按钮)
1.ToggleButton (1)介绍 (2)组件形状 (3)xml文件设置 <?xml version="1.0" encoding="utf-8"? ...
- svn 命令
svn基本的操作流程就是: 你刚刚进入一个新的公司,让你接手一个正在进行的项目,你打开终端写下了:svn co svn://192.168.1.1/pro/domain 然后就可以在当前目录里面找到一 ...
- 洛谷 P3191 [HNOI2007]紧急疏散EVACUATE(网络最大流)
题解 二分答案+Dinic最大流 二分答案\(mid\) 把门拆成\(mid\)个时间点的门 相邻时间的门连一条\(inf\)的边 预处理出每个门到每个人的最短时间 为\(dis[k][i][j]\) ...
- WPF Hidden和Collapsed
对于这两种设定,其实已经提示的很清楚了 Visibility="Hidden"不显示元素,但是在布局为元素保留空间 Visibility="Collapsed" ...
- HDU - 3949 线性基应用
题意:求第\(k\)小的异或和 要点: 1.线性基能表示原数组的任意异或和,但不包括0,需特判(flag) 2.线性基中的异或组合只有\(2^{|B|}-1\)个,如果可以异或为0,则组合数为\(2^ ...
- UESTC - 1147 求最短路方案数
这道题很是说明了记忆化搜索的重要性 瞎bfs递推半天发现没卵用(也许是姿势不对,但我认为树形或图形dfs明显好写并且很好正确地递推) 参考了别人的写法,总感觉自己的实现能力太弱了 还有题目是1e9+9 ...
- V1-Team Scrum Meeting 博客汇总
V1-Team Scrum Meeting 博客汇总 计划文档 功能规格说明书 技术规格说明书 项目分解 贡献分配规则 一.Alpha阶段 第一次 Scrum Meeting 第二次 Scrum Me ...
- 转 禁用HAIP,cluster_interconnects配错了集群无法启动
简介: 在Oracle 11.2.0.2之前,私网的冗余一般是通过在OS上做网卡绑定(如Bond等)来实现的,从Oracle 11.2.0.2版本开始推出HAIP(Highly Available V ...
- java多线程-Thread
大纲 sleep yield join setDaemon sleep: public static native void sleep(long millis) throws Interrupted ...