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 ...
随机推荐
- FJWC2019 子图 (三元环计数、四元环计数)
给定 n 个点和 m 条边的一张图和一个值 k ,求图中边数为 k 的联通子图个数 mod 1e9+7. \(n \le 10^5, m \le 2 \times 10^5, 1 \le k \le ...
- SDUT OJ 数据结构实验之链表八:Farey序列
数据结构实验之链表八:Farey序列 Time Limit: 10 ms Memory Limit: 600 KiB Submit Statistic Discuss Problem Descript ...
- vue-i18n.esm.js?a925:14 [vue-i18n] Value of key '图标管理' is not a string!
解决方案:在项目的index.js文件中修改配置,让在创建 i18n 示例的时候加上参数去掉这些 warning const i18n = new VueI18n({ locale: lang, // ...
- 基于linux内核包过滤技术的应用网关
目录 基于linux内核包过滤技术的应用网关 硬件形态 基本原理 应用场景 主要功能 其他功能 客户定制 基于linux内核包过滤技术的应用网关 硬件形态 基本原理 应用场景 媒体内容过滤和深度识别 ...
- Python-匿名函数(lambda),map()
1. map() 描述 map() 会根据提供的函数对指定序列做映射. 第一个参数 function 以第二个参数序列中的每一个元素调用 function 函数,返回一个map对象. 语法 map() ...
- python-继承,父类,子类
class Spell(object): def __init__(self, incantation, name): self.name = name self.incantation = inca ...
- 将M个客服随机分配给N个客户
class AllocUser { //客户多于客服 public static void Test() { var customers = new List<Customer>() { ...
- maven-eclipse-plugin downloadSources downloadJavadocs
<plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-eclip ...
- Python中 字符串 转换为 字典
需求:把以下字符串转换为字典 #字符串 testStr = '{ "pName": "Ceshi", "gender": 1, " ...
- mssql 死锁方面的一些资料。
-- 1.查询死锁的进程,表名 select request_session_id spid,OBJECT_NAME(resource_associated_entity_id) as tableNa ...