最近的面试中有一个面试官问我按钮级别的权限怎么控制，我说直接v-if啊，他说不够好，我说我们项目中按钮级别的权限控制情况不多，所以v-if就够了，他说不够通用，最后他对我的评价是做过很多东西，但是都不

在基础的 vue 项目中都是默认以前端配置好静态路由 但在一些较为成熟或大型项目中我们会通常会遇到 权限控制 这个问题，这样我们就涉及到动态路由的设置了 特别是一些 后台管理系统项目，需要对

403 页面通常表示无权限访问，与 404 页面代表着不同含义。而大部分管理后台框架仅提供了 404 页面的支持，但却忽略了对 403 页面的处理。

在3年前发布了一篇vue2后台管理系统动态路由方案，时至今日，vue2已经升级到了vue3，动态路由的实现方案也同步做出了一些升级迭代，帮助开发者们更高效的完成业务需求，然后摸鱼🐟。

目标 vue-router基础使用 vue-router数据结构 meta数据结构定义 路由守卫 路由鉴权过程 路由permisson逻辑实现 vue-router基础使用 vue项目的开发是离不开v

后端返回路由格式： 处理后端返回的路由表中的 component ，将 "Layout" 转换为组件对象，children中component为页面组件的路径 将默认路由和动态路由合并constant

前言：做管理系统必定绕不开权限管理这一块，本文详细介绍了对路由权限，接口权限，菜单栏权限，动态路由设置，按钮权限五个模块。

感觉 vue-element-admin 开源项目 对登录的权限校验和动态路由的逻辑复用性还是很强的，可以在自己的项目中直接拿来用了。为了加深记忆就写个文章记录一下学习笔记。 点击登录后，会返回该用户的权限信息，拿去和动态路由数组的角色权限做配对，把该用户可以访问的路由筛选出来…