时间戳

首页 > 解决方案 > 如何使用 PrimeFaces 将 pe:badge 添加到 bean 中动态创建的菜单

jsf - 如何使用 PrimeFaces 将 pe:badge 添加到 bean 中动态创建的菜单

问题描述

我正在将静态菜单重写为动态菜单，因为我们的客户想要动态更改菜单。在此之前，我的 xhtml 中有标准的 <p:menu> <p:menuItem> </p:menu> 结构。

但现在我已将其更改为： <p:menu model="#{pageTemplateView.menuModel}"/>

我正在我的支持 bean 中创建模型，如下所示：

DefaultMenuItem menuItem = new DefaultMenuItem();
menuItem.setIcon(item.getIcon());
menuItem.setTarget(item.getLink());
menuItem.setValue(item.getName());

但问题是我不知道如何在<pe:badge>bean 的菜单项中添加组件。

在此之前，我通过以下方式将徽章添加到菜单中：

<p:menuitem id="tasks_icon_menuitem_id" icon="fa fa-tasks" url="#">
  <pe:badge content="#{badgeCountBean.badgeCount()}"/>
</p:menuitem>

那么如何添加<pe:badge>到 bean 中动态创建的菜单呢？

我正在使用 PrimeFaces 8

标签： jsfprimefacesprimefaces-extensions

解决方案

经过几个小时的测试和四处游荡，我发现了阻止我将徽章添加到默认菜单项的问题。问题是当您尝试添加孩子时DefaultManuItem：

Badge badge = new Badge();
DefaultMenuItem defaultMenuItem = new DefaultMenuItem();
defaultMenuItem.getChildren().add(badge);

由于 DefaultMenuItem:: getChildren() 是这样实现的，因此您会得到不受支持的操作异常：

public List<UIComponent> getChildren() {
    return Collections.emptyList();
}

但我发现了一个丑陋的解决这个问题的方法。所以我可能会分享它，并且可能会得到更好的解决方案。在我的 xhtml 中，我添加了空菜单并为其提供了固定 ID，如下所示：

<!-- MENU PLACEHOLDER -->
<p:menu id="dynamic_menu_placeholder"/>

<!-- need to add dummy badge to xhtml otherwise it wont be displayed -->
<pe:badge/>

然后在我的 bean 中，我通过 ID 获取组件并向其中添加UIMenuItem元素，如下所示：

// get component by ID
UIComponent component = FacesContext.getCurrentInstance().getViewRoot().findComponent(":form:dynamic_menu_placeholder");
Menu menu = (Menu) component;
menu.getChildren().clear();

for (MenuItem item : menuItemList) {

    // creating menu item
    UIMenuItem menuItem = new UIMenuItem();
    menuItem.setUrl(item.getLink());
    menuItem.setValue(item.getValue());
    menuItem.setId(... generated some id);
    
    // creating badge
    Badge badge = new Badge();
    badge.setContent(...getBadgeCount()..);
    
    // adding badge to menu item
    menuItem.getChildren().add(badge);
}

// addin menu item to menu
menu.getChildren().add(menuItem);

推荐阅读