PrimeFaces 8 如何在Bean动态创建的菜单项中添加pe:badge组件

PrimeFaces 8 的DefaultMenuItem本身支持挂载子UI组件，渲染流程和静态标签嵌套子组件的逻辑完全一致，不需要自定义菜单渲染器，直接在Bean构建菜单项的流程中实例化pe:badge对应的服务端类、添加为菜单项的子节点即可。

具体实现步骤 #

• 引入pe:badge对应的服务端组件类：对应标签的服务端实现类为org.primefaces.extensions.component.badge.Badge，不需要额外写适配逻辑。
• 在原有菜单项构建逻辑中，初始化Badge实例并绑定业务配置，按照原有静态标签的配置给Badge设置对应属性、绑定动态EL表达式。
• 将Badge实例添加为菜单项的子节点。

示例代码 #

在原有动态菜单项构建逻辑的基础上补充Badge的创建和挂载逻辑：

// 原有动态菜单项构建逻辑
DefaultMenuItem menuItem = new DefaultMenuItem();
menuItem.setIcon(item.getIcon());
menuItem.setTarget(item.getLink());
menuItem.setValue(item.getName());

// 仅对需要展示徽章的业务菜单项（如任务中心菜单）执行以下逻辑
if ("tasks".equals(item.getMenuCode())) {
    // 初始化pe:badge组件实例
    Badge badge = new Badge();
    // 绑定徽章数量的动态EL表达式，和原有静态写法的表达式保持一致
    badge.setValueExpression("content",
        createValueExpression("#{badgeCountBean.badgeCount()}", Integer.class));
    // 可按需配置徽章的样式、严重级别等属性，和静态标签的属性一一对应
    badge.setSeverity("danger");

    // 将badge作为子组件添加到菜单项中
    menuItem.getChildren().add(badge);
}

配套工具方法 #

上述代码中用到的EL表达式创建方法，可以直接在Backing Bean中实现，用于将字符串形式的EL表达式转换为服务端可解析的ValueExpression对象：

private ValueExpression createValueExpression(String el, Class expectedType) {
    FacesContext facesContext = FacesContext.getCurrentInstance();
    return facesContext.getApplication()
        .getExpressionFactory()
        .createValueExpression(facesContext.getELContext(), el, expectedType);
}

注意事项 #

• 该实现和静态嵌套写法的渲染效果完全一致，PrimeFaces的Menu组件在渲染动态菜单项时，会自动遍历MenuItem下挂载的所有子组件，不会出现样式错位、动态值不刷新的问题。
• 不要尝试将徽章数字直接拼接到菜单项的value字段中，这种方式无法复用pe:badge自带的样式、动画特性，和原有静态实现的视觉效果存在差异。
• 该方案完全兼容PrimeFaces 8 配套的PrimeFaces Extensions版本，不需要调整依赖版本或者自定义菜单渲染逻辑。

内容的提问来源于stack exchange，提问作者Kiki