构建菜单列表父子级结构，并构建前端路由所需的菜单结构

本文链接：https://blog.youkuaiyun.com/weixin_50756063/article/details/130337978

本文介绍了如何在前端开发中构建具有父子级关系的菜单列表，并详细阐述了如何根据该结构来构建符合路由需求的菜单，主要涉及JavaScript和Java技术。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/**
     * 根据父节点的ID获取所有子节点
     * 
     * @param list 所有父子节点菜单数据
     * @param parentId 传入的父节点ID
     * @return String
     */
    public List<SysMenu> getChildPerms(List<SysMenu> list, int parentId)
    {
   
        List<SysMenu> returnList = new ArrayList<SysMenu>();
        for (Iterator<SysMenu> iterator = list.iterator(); iterator.hasNext();)
        {
   
            SysMenu t = (SysMenu) iterator.next();
            // 一、根据传入的某个父节点ID,遍历该父节点的所有子节点
            if (t.getParentId() == parentId)
            {
   
                recursionFn(list, t);
                returnList.add(t);
            }
        }
        return returnList;
    }
	/**
     * 递归列表
     * 
     * @param list
     * @param t
     */
    private void recursionFn(List<SysMenu> list, SysMenu t)
    {
   
        // 得到子节点列表
        List<SysMenu> childList = getChildList(list, t);
        t.setChildren(childList);
        for (SysMenu tChild : childList)
        {
   
            if (hasChild(list, tChild))
            {
   
                recursionFn(list, tChild);
            }
        }
    }
	/**
     * 得到子节点列表
     */
    private List<SysMenu> getChildList(List<SysMenu> list, SysMenu t)
    {
   
        List<SysMenu> tlist = new ArrayList<SysMenu>();
        Iterator<SysMenu> it = list.iterator();
        while (it.hasNext())
        {
   
            SysMenu n = (SysMenu) it.next();
            if (n.getParentId().longValue() == t.getMenuId().longValue())
            {
   
                tlist.add(n);
            }
        }
        return tlist;
    }
	/**
     * 判断是否有子节点
     */
    private boolean hasChild(List<SysMenu> list, SysMenu t)
    {
   
        return getChildList(list, t).size() > 0 ? true : false;
    }
/**
 * 菜单权限表 sys_menu
 * 
 */
public class SysMenu extends BaseEntity
{
   
    private static final long serialVersionUID = 1L;

    /** 菜单ID */
    private Long menuId;

    /** 菜单名称 */
    private String menuName;

    /** 父菜单名称 */
    private String parentName;

    /** 父菜单ID */
    private Long parentId;

    /** 显示顺序 */
    private String orderNum;

    /** 路由地址 */
    private String path;

    /** 组件路径 */
    private String component;

    /** 是否为外链（0是 1否） */
    private String isFrame;

    /** 是否缓存（0缓存 1不缓存） */
    private String isCache;

    /** 类型（M目录 C菜单 F按钮） */
    private String menuType;

    /** 显示状态（0显示 1隐藏） */
    private String visible;
    
    /** 菜单状态（0显示 1隐藏） */
    private String status;

    /** 权限字符串 */
    private String perms;

    /** 菜单图标 */
    private String icon;

    /** 子菜单 */
    private List<SysMenu> children = new ArrayList<SysMenu>();

    public Long getMenuId()
    {
   
        return menuId;
    }

    public void setMenuId(Long menuId)
    {
   
        this.menuId = menuId;
    }

    @NotBlank(message = "菜单名称不能为空")
    @Size(min = 0, max = 50, message = "菜单名称长度不能超过50个字符")
    public String getMenuName()
    {
   
        return menuName;
    }

    public void setMenuName(String menuName)
    {
   
        this.menuName = menuName;
    }

    public String getParentName()
    {
   
        return parentName;
    }

    public void setParentName(String parentName)
    {
   
        this.parentName = parentName;
    }

    public Long getParentId()
    {
   
        return parentId;
    }

    public void setParentId(Long parentId)