springboot + vue 实现递归生成多级菜单(实例代码)
开发过程中,涉及到多级菜单的应用,找了一些资料案例实现如下(使用springboot+layui+oracle):
创建菜单表:
--创建菜单表 createtablewxmini_menus( menu_idnumberunique,--菜单ID menu_namevarchar2(20), menu_urlvarchar2(200), menu_iconvarchar2(100), parent_idnumber,--父菜单ID statusvarchar2(10), menu_sortnumber, last_update_dateDATEnotnull, last_updated_byNUMBERnotnull, creation_dateDATEnotnull, created_byNUMBERnotnull, last_update_loginNUMBER ); --插入菜单记录 insertintowxmini_menusvalues((select1fromdual),'设置',null,null,null,1,100,sysdate,-1,sysdate,-1,-1); insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'用户',null,null,1,1,null,sysdate,-1,sysdate,-1,-1); insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'网站用户',null,null,1,1,null,sysdate,-1,sysdate,-1,-1); insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'角色管理',null,null,1,1,null,sysdate,-1,sysdate,-1,-1); --主菜单二 insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'主页',null,null,null,1,1,sysdate,-1,sysdate,-1,-1); insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'控制台',null,null,5,1,null,sysdate,-1,sysdate,-1,-1); insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'主页一',null,null,5,1,null,sysdate,-1,sysdate,-1,-1); insertintowxmini_menusvalues((selectmax(menu_id)+1fromyl_wxmini_menus),'主页二',null,null,5,1,null,sysdate,-1,sysdate,-1,-1);
实体类WxMenu.java:
publicclassWxMenu{ privateStringmenu_id; privateStringmenu_name; privateStringmenu_url; privateStringmenu_icon; privateStringparent_id; privateStringparent_menu_name; privateStringstatus; privateStringmenu_sort; privateStringlast_update_date; privatelonglast_updated_by; privateStringcreation_date; privatelongcreated_by; privatelonglast_update_login; privateListchildMenus; ...... } Controller控制层: @Controller @RequestMapping("/index") publicclassIndexController{ @Autowired privateWxUserServicewxUserService; /** *获取所有菜单数据 *@return */ @ResponseBody @RequestMapping(value="/loadAuthMenus",method=RequestMethod.GET) publicLayuiJsonFormat login(Stringusername,Stringpassword,HttpServletRequestrequest){ //获取所有菜单数据 List wxMenus=wxUserService.getAllMenus(); //定义存储一级菜单 List menuList=newArrayList (); //先找到所有的一级菜单 for(inti=0;i getChildmenus(Stringid,List wxMenus){ //子菜单 List childMenus=newArrayList<>(); for(WxMenumenu:wxMenus){ if(StringUtils.isNotBlank(menu.getParent_id())){ if(menu.getParent_id().equals(id)){ childMenus.add(menu); } } } for(WxMenumenu:childMenus){ //数据库动态存储菜单的url,此时判断url为空的,则是节点菜单(存在子菜单) if(StringUtils.isBlank(menu.getMenu_url())){ //递归调用 menu.setChildMenus(getChildmenus(menu.getMenu_id(),wxMenus)); } } if(childMenus.size()==0){ returnnull; } returnchildMenus; } }
service类WxUserService.java
publicinterfaceWxUserService{ //获取所有菜单 ListgetAllMenus(); } service实现类: @Service("wxUserService") publicclassWxUserServiceImplimplementsWxUserService{ @Autowired privateWxUserMapperwxUserMapper; @Override publicList getAllMenus(){ returnwxUserMapper.getAllMenus(); } } mapper: publicinterfaceWxUserMapper{ List getAllMenus(); }
mybatissql:
select*fromwxmini_menuswmorderbywm.menu_sortasc 最后,前端样式使用layui,html+js如下: {{menu.menu_name}} {{child.menu_name}}
最后效果图如下:
总结
以上所述是小编给大家介绍的springboot+vue实现递归生成多级菜单,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。