我在素数 TabView 组件中实现了动态选项卡。
现在选项卡成功打开和关闭,没有任何问题。
现在,我想在动态素数标签视图上添加默认的静态选项卡。 (第一个索引(
这是我的示例代码:
<p:tabView id="tab-group"
style="width: 100%"
value="#{webSocketBean.listTargetServers}"
var="tab">
<p:ajax event="tabClose" listener="#{webSocketBean.closeChannel}" skipChildren="false"/>
<p:tab id="welcome-tab"
title="Getting Started"
titleStyle="background-color: #1b6bad ; color: white">
<ui:include src="getting-started.xhtml"/>
</p:tab>
<p:tab title="#{tab.ipAddress}"
titletip="#{tab.ipAddress} (#{tab.name} #{tab.logPath})"
closable="true">
<p:inputText placeholder="Search" styleClass="log-search-box"/>
<div class="log-box">
<h:outputText id="logOuputText_#{tab.id}" value=""/>
</div>
</p:tab>
</p:tabView>
这是我的爪哇豆:
@Named
@SessionScoped
public class WebSocketBean implements Serializable {
private List<TargetServer> listTargetServers;
private TargetServer selectedTargetServer;
@PostConstruct
public void init() {
listTargetServers = new ArrayList<>();
}
public void openChannel() {
listTargetServers.add(selectedTargetServer);
}
public void closeChannel(TabCloseEvent event) {
selectedTargetServer = (TargetServer) event.getData();
listTargetServers.remove(selectedTargetServer);
}
public List<TargetServer> getListTargetServers() {
return listTargetServers;
}
public void setListTargetServers(List<TargetServer> listTargetServers) {
this.listTargetServers = listTargetServers;
}
public TargetServer getSelectedTargetServer() {
return selectedTargetServer;
}
public void setSelectedTargetServer(TargetServer selectedTargetServer) {
this.selectedTargetServer = selectedTargetServer;
}
}
欢迎选项卡未显示在我的示例代码中。
如何解决这个问题?
我的环境 :
开放自由 19.0.0.4
总理脸 7.0
JSF 2.3
最后 .
我用JSF上的一个简单的技巧解决了我的问题。
实际上这不是一个好的解决方案,但解决了我的问题。
我把豆子改成这个:
@Named
@SessionScoped
public class WebSocketBean implements Serializable {
private List<Object> listTargetServers;
private TargetServer selectedTargetServer;
@PostConstruct
public void init() {
listTargetServers = new ArrayList<>();
Tab tab = new Tab();
tab.setText("Getting Started");
listTargetServers.add(tab);
}
public void openChannel() {
listTargetServers.add(selectedTargetServer);
}
public void closeChannel(TabCloseEvent event) {
selectedTargetServer = (TargetServer) event.getData();
listTargetServers.remove(selectedTargetServer);
}
public List<Object> getListTargetServers() {
return listTargetServers;
}
public void setListTargetServers(List<Object> listTargetServers) {
this.listTargetServers = listTargetServers;
}
public TargetServer getSelectedTargetServer() {
return selectedTargetServer;
}
public void setSelectedTargetServer(TargetServer selectedTargetServer) {
this.selectedTargetServer = selectedTargetServer;
}
}
并将 xhtml 更改为:
<p:tabView id="tab-group"
style="width: 100%"
value="#{webSocketBean.listTargetServers}"
var="tab">
<p:ajax event="tabClose" listener="#{webSocketBean.closeChannel}" skipChildren="false"/>
<c:set var="tabType" value="#{tab['class'].simpleName}"/>
<p:tab title="#{tabType eq 'TargetServer' ? tab.ipAddress : tab.text}"
titletip="#{tabType eq 'TargetServer' ? tab.ipAddress.concat(' (').concat(tab.name).concat(')'): null}"
titleStyle="#{tabType eq 'TargetServer' ? '' : 'background-color: #1b6bad ; color: white'}"
closable="#{tabType eq 'TargetServer' ? 'true' : 'false'}">
<h:panelGroup layout="block" styleClass="log-box" rendered="#{tabType eq 'TargetServer'}">
<p:inputText placeholder="Search" styleClass="log-search-box"/>
<div class="logOutputText">
<h:outputText value=""/>
</div>
</h:panelGroup>
<h:panelGroup layout="block" styleClass="log-box" rendered="#{tabType eq 'Tab'}">
<ui:include src="getting-started.xhtml"/>
</h:panelGroup>
</p:tab>
</p:tabView>
有点硬编码,但这是解决我的问题的简单想法。