Jsf 如何在Primefaces中使用ui:insert p:tabMenu_Jsf_Jsf 2_Primefaces

Jsf 如何在Primefaces中使用ui:insert p:tabMenu

jsf jsf-2 primefaces

Jsf 如何在Primefaces中使用ui:insert p:tabMenu,jsf,jsf-2,primefaces,Jsf,Jsf 2,Primefaces,我有一个兄弟的问题，我不知道如何解决。我有一个Primefacesp:tabMenu，用于调用延迟加载的选项卡 <p:tabMenu id="tabs" activeIndex="0" > <p:menuitem value="tab1" url="/tab1.jsf" /> <p:menuitem value="tab2" url="/tab2.jsf" /> </p:tabMenu> 我想使用JSF标记ui:ins

我有一个兄弟的问题，我不知道如何解决。我有一个Primefaces

p:tabMenu

，用于调用延迟加载的选项卡

<p:tabMenu id="tabs" activeIndex="0" > 
    <p:menuitem value="tab1" url="/tab1.jsf" /> 
    <p:menuitem value="tab2" url="/tab2.jsf" /> 

</p:tabMenu>

我想使用JSF标记

ui:insert

来调用选项卡的代码。如何将

ui:insert

标记组合到上述代码中？

我假设您希望在选项卡之间共享代码

我想你是在盲目地盯着tabMenu组件看。在这里正确使用模板不需要it的帮助

只是：

定义模板

让页面使用该模板

然后，这些页面可以是选项卡或任何您想要的内容

一个合适的结构可能是定义tabs.xhtml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui"
    xmlns:pe="http://primefaces.org/ui/extensions"
    xmlns:o="http://omnifaces.org/ui">


<h:head>
    <h:outputStylesheet name="style.css" library="css" />
    <div id="header">

        <ui:insert name="header">
            <title><ui:insert name="title">title</ui:insert></title>

        </ui:insert>
    </div>

</h:head>

<h:body>
    <div id="content">

        <ui:insert name="content">
        content here
        </ui:insert>
    </div>

</h:body>

</html>


标题
满足于此

然后，对于您拥有的每个选项卡：

<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui" xmlns:o="http://omnifaces.org/ui"
    xmlns:of="http://omnifaces.org/functions"
    xmlns:pe="http://primefaces.org/ui/extensions"
    template="/WEB-INF/templates/template.xhtml">

    <ui:define name="header">
    a specific tab header here
    </ui:define>
    <ui:define name="content">
    specific content here
    </ui:define>
    </ui:composition>


这里有一个特定的选项卡标题
具体内容在这里

注意，这只是JSF2的标准模板。祝你好运

我在这里看到了两种方法：

1）每个选项卡使用一页。使用p:tabMenu组件（primefaces 3.4中提供）。在这种情况下，如果用户正在查看一个选项卡并单击第二个选项卡以显示它，他将被重定向到另一个页面
优点：如果您想从另一个页面导航到第二个选项卡，这很容易，因为它是一个不同的页面（参见第二种方法中的缺点）。此外，每个选项卡页面的加载速度很快，因为它只包含一个选项卡的代码。您将有更好的代码分离。
缺点：如果用户转到其他选项卡，则当前选项卡中输入的所有数据都将丢失。此外，从一个选项卡切换到另一个选项卡也不是很快，因为需要导航

这是一个选项卡（tab1.xhtml）的页面：

这是另一个选项卡（tab2.xhtml）的代码：

2）另一种方法是使用p:tabView创建一个页面。在这种情况下，所有选项卡内容都位于同一页面中。您可以在p:tabView上使用dynamic=“true”属性按需呈现选项卡内容并加速页面加载。
优点：从一个选项卡到另一个选项卡的过渡更加平滑（始终保持在同一页上）。
缺点：例如，如果您想直接导航到第二个选项卡，就不那么容易了。因此，您必须使用tabView的activeIndex属性来指向托管bean中处理第一个选项卡的属性，并且在实际不需要第一个选项卡的bean时，您仍然需要构建第一个选项卡的bean

这是包含选项卡的主页的代码：

<h:body>
    <p:tabView dynamic="true">
        <p:tab id="tab1" title="Tab 1" >
            <ui:include src="tab2.xhtml" />
        </p:tabView>
        <p:tab id="tab2" title="Tab 2" >
            <ui:include src="tab2.xhtml" />
        </p:tab>
    </p:tabView>
</h:body>

您将需要每个选项卡（插入主页）的页面： tab1.xhtml：

tab2.xhtml：

您所说的标签代码是什么意思？您应该了解如何使用标签。你可以让你所有的tab.jsf文件扩展包含tabMenu的主模板。你能告诉我如何使用

ui:insert

到

p:tabMenu

？@user1285928为什么不使用

src=

值

你能写一个简短的例子吗？是的。JSF模板非常简单。但是我又如何将p:tabMenu与模板混合呢？请看我上面的例子。p:tabMenu中的每个选项卡都是一个用ui:composition编写的页面。这可能是一个模板页面。如果你对这个答案不满意，你最好给出一个你想做的适当的例子。用伪代码之类的东西写
<h:body>
    <p:tabMenu activeIndex="1">  
        <p:menuitem value="Tab 1" url="/tab1.jsf" />  
        <p:menuitem value="Tab 2" url="/tab2.jsf" />  
    </p:tabMenu>
    <!-- content of tab2 goes here -->
</h:body>

<h:body>
    <p:tabView dynamic="true">
        <p:tab id="tab1" title="Tab 1" >
            <ui:include src="tab2.xhtml" />
        </p:tabView>
        <p:tab id="tab2" title="Tab 2" >
            <ui:include src="tab2.xhtml" />
        </p:tab>
    </p:tabView>
</h:body>