Vue路由权限控制如何实现细粒度访问权限管理？

本文共计1964个文字，预计阅读时间需要8分钟。

前言：本人在公司主要负责后台系统的开发，其中路由和权限校验是非常重要且基本的一环。在实际情况的开发项目中，关于登录和路由权限的控制主要参照了vue-element-admin这个明星项目。

前言

本人在公司主要负责中后台系统的开发，其中路由和权限校验算是非常重要且最为基本的一环。实际开发项目中，关于登录和路由权限的控制参照了vue-element-admin这个明星项目，并在此基础上基于业务进行了整合，接下来我会以这个项目为例，仔细地剖析整个路由和权限校验的过程，也算是对这个知识点的一些总结。

项目总体目录结构

进入今天主题之前，我们先来梳理下整个项目,src目录下的。

• api: 接口请求
• assets: 静态资源
• components: 通用组件
• directive: 自定义指令
• filters: 自定义过滤器
• icons: 图标
• layout: 布局组件(页面架构核心)
• router: 路由配置(路由权限核心模块)
• store: 状态管理
• styles: 样式文件
• utils: 工具方法
• views: 页面组件
• permission.js 权限管理

对这项目感兴趣的同学可以自行，有针对性地学习，除了路由权限校验的功能以外，也包含了很多有意思的功能，相信能够学到不少东西。