若依框架前端菜单生成，权限标识，路由地址

最新推荐文章于 2025-09-01 23:16:17 发布

原创

最新推荐文章于 2025-09-01 23:16:17 发布 · 1.5w 阅读

35 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #vue.js #javascript

本文将指导如何根据后端生成的代码创建前端菜单页面，涉及目录与菜单的生成，以及使用SQL插入权限相关的菜单项。通过实例展示如何设置list、export、query等操作的权限标识和路由地址。

若依菜单分类三种类型M（目录）、C（菜单）、F（按钮）

在这里插入图片描述
系统模板，模仿框架写法

根据后端生成代码来创建前端页面

在菜单管理页面生成目录和菜单
路由地址填写模块名
在这里插入图片描述

路由地址：控制器中的地址
组件路径：前端项目中的路径
在这里插入图片描述
权限标识字符有list、export、query、add、edit、remove
list 查询十条数据，控制菜单（index.vue页面）初始化
export、query、add、edit、remove 分别是按钮权限

权限标识=模块名：控制器地址：方法
pms: category:list
在这里插入图片描述
菜单管理页面生成菜单和目录后，在数据库查询生成的菜单ID

使用生成代码的部分SQL

-- 按钮父菜单ID
SELECT @parentId := 1067;

-- 按钮 SQL
insert into sys_menu (menu_name, parent_id, order_num, path, component, is_frame, is_cache, menu_type, visible, status, perms, icon, create_by, create_time, update_by, update_time, remark)
values

最低0.47元/天解锁文章