本文概述
它是一个容器组件, 用于对同一网页上的选项卡中的内容进行分组。 <p:tabView>组件用于创建容器。 <p:tab>是<p:tabView>的子组件, 用于分别创建选项卡。当我们想在同一网页上显示更多信息时, 这很有用。
TabView属性
Attribute | Default value | Type | Description |
---|---|---|---|
rendered | true | Boolean | 它需要布尔值来指定组件的呈现。 |
activeIndex | 0 | Integer | 用于设置活动选项卡的索引。 |
effect | null | String | 用于设置过渡效果的名称。 |
effectDuration | null | String | 它用于设置过渡效果的持续时间。 |
dynamic | false | Boolean | 它可以使非活动选项卡的延迟加载。 |
cache | true | Boolean | 它用于设置缓存。 |
onTabChange | null | String | 单击选项卡时执行。 |
onTabShow | null | String | 显示选项卡时执行。 |
onTabClose | null | String | 它在选项卡关闭时执行。 |
style | null | String | 用于设置主容器的内联样式。 |
var | null | String | 它是引用集合中项目的迭代器的名称。 |
value | null | Object | 它是显示动态选项卡的收集模型。 |
orientation | top | String | 用于设置选项卡标题的方向。 |
dir | ltr | String | 它定义了文本方向, 有效值为ltr和rtl。 |
scrollable | false | Boolean | 启用后, 标签页标题可以水平滚动而不是环绕滚动。 |
prependId | true | Boolean | 它用于添加id。 |
tabindex | 0 | String | 它按跳位顺序指定元素的位置。 |
例子
在下面的示例中, 我们正在实现<p:tabView>组件。本示例包含以下文件。
JSF文件
// tabView.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:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>TabView</title>
</h:head>
<h:body>
<h:form id="form">
<p:growl id="msgs" showDetail="true" />
<h3 style="margin-top:0">Course Description</h3>
<p:tabView>
<p:tab title="Java">
<h:panelGrid columns="2" cellpadding="10">
<p:graphicImage name="images/courses/java.png" />
<h:outputText
value="Java is a programming language and a platform.
Java is a high level, robust, secured and object-oriented programming language.
Platform: Any hardware or software environment in which a program runs, is known as a platform.
Since Java has its own runtime environment (JRE) and API, it is called platform." />
</h:panelGrid>
</p:tab>
<p:tab title="Spring">
<h:panelGrid columns="2" cellpadding="10">
<p:graphicImage name="images/courses/spring.png" />
<h:outputText value="Spring is a lightweight framework. It can be thought of as a framework
of frameworks because it provides support to various frameworks such as Struts, Hibernate, Tapestry, EJB, JSF etc.
The framework, in broader sense, can be defined as a structure where we find solution of the various technical problems. " />
</h:panelGrid>
</p:tab>
<p:tab title="Python">
<h:panelGrid columns="2" cellpadding="10">
<p:graphicImage name="images/courses/python.png" />
<h:outputText value="Python is a simple, easy to learn, powerful, high level and object-oriented
programming language. Guido Van Rossum is known as the founder of python programming." />
</h:panelGrid>
</p:tab>
</p:tabView>
</h:form>
</h:body>
</html>
输出
评论前必须登录!
注册