JSF 复合组件示例-手册内容

JSF教程 - JSF复合组件示例

JSF可以定义自定义组件来渲染自定义内容。

为了创建一个自定义组件，我们需要创建一个资源文件夹。并将一个xhtml文件放在resources文件夹中与复合命名空间。

我们需要使用复合标签composite:interface，composite:attribute和composite:implementation，来定义复合组件的内容。

然后在composite:implementation中使用cc.attrs来获取在composite:interface中使用composite:attribute定义的变量。

以下代码显示如何使用composite:interface和composite:implementation。

    <composite:interface>
    
      <composite:attribute name="nameLable" />
      <composite:attribute name="nameValue" />
      <composite:attribute name="emailLable" />
      <composite:attribute name="emailValue" />
      
       <composite:attribute name="registerButtonText" />
      <composite:attribute name="registerButtonAction" 
        method-signature="java.lang.String action()" />
        
    </composite:interface>
  
  <composite:implementation>
  
    <h:form>
      
      <h:message for="textPanel" />
      
      <h:panelGrid columns="2" id="textPanel">
      
        #{cc.attrs.nameLable} : 
        <h:inputText id="name" value="#{cc.attrs.nameValue}" />
        
        #{cc.attrs.emailLable} : 
        <h:inputText id="email" value="#{cc.attrs.emailValue}" />
        
      </h:panelGrid>
      
      <h:commandButton action="#{cc.attrs.registerButtonAction}" 
        value="#{cc.attrs.registerButtonText}"/>
    </h:form>
  </composite:implementation>

例子

以下代码来自result.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://java.sun.com/jsf/html"
      >
 
    <h:body>
 
      <h1>Composite Components in JSF 2.0</h1>
 
      Name : #{user.name}
      
      <br />
      
      E-mail : #{user.email}
      
    </h:body>
</html>

以下代码来自demo.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://java.sun.com/jsf/html"
      xmlns:lmonkey="http://java.sun.com/jsf/composite/lmonkey"
      >
 
    <h:body>
 
    <lmonkey:register 
      nameLable="Name" 
      nameValue="#{user.name}" 
      emailLable="E-mail" 
      emailValue="#{user.email}"

      registerButtonText="Register" 
      registerButtonAction="#{user.registerAction}"
       />
  
    </h:body>
</html>

下面的代码来自UserBean.java。

package com.lmonkey.common;


import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name="user")
@SessionScoped
public class UserBean{
 
  public String name;
  public String email;
  
  public String getName() {
    return name;
  }
  public void setName(String name) {
    this.name = name;
  }
  public String getEmail() {
    return email;
  }
  public void setEmail(String email) {
    this.email = email;
  }

  public String registerAction(){
    return "result";
  }
}

以下代码来自register.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://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:composite="http://java.sun.com/jsf/composite">
    
    <composite:interface>
    
      <composite:attribute name="nameLable" />
      <composite:attribute name="nameValue" />
      <composite:attribute name="emailLable" />
      <composite:attribute name="emailValue" />
      
       <composite:attribute name="registerButtonText" />
      <composite:attribute name="registerButtonAction" 
        method-signature="java.lang.String action()" />
        
    </composite:interface>
  
  <composite:implementation>
  
    <h:form>
      
      <h:message for="textPanel" />
      
      <h:panelGrid columns="2" id="textPanel">
      
        #{cc.attrs.nameLable} : 
        <h:inputText id="name" value="#{cc.attrs.nameValue}" />
        
        #{cc.attrs.emailLable} : 
        <h:inputText id="email" value="#{cc.attrs.emailValue}" />
        
      </h:panelGrid>
      
      <h:commandButton action="#{cc.attrs.registerButtonAction}" 
        value="#{cc.attrs.registerButtonText}"/>
    </h:form>
  </composite:implementation>
</html>

运行

将生成的WAR文件从目标文件夹复制到Tomcat部署文件夹，并运行Tomcat-Install-folder/bin/startup.bat。

Tomcat完成启动后，在浏览器地址栏中键入以下URL。

http://localhost:8080/simple-webapp/demo.xhtml

菜单 学习猿地 - LMONKEY

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练！告别无效练习

接私单赚外块

VIP优先接，累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

Java开发工程师

何以解忧，唯有 Java！

Python开发工程师

人生苦短我要学Python！

PHP开发工程师

PHP是世界上最好的编程语言!

GO开发工程师

想优雅的写程序，赶紧GO!

大数据开发工程师

弄大数据，就是在搞革命!

前端开发工程师

不仅最好，而且最全!

UI开发工程师

这个世界从来不缺少美，缺少你来创造美!

Linux运维工程师

不只是说说而已！

WEB前端1+X

不仅为考证，轻松做开发

计算机二级（C语言）

一切只为考证！

猿工手册

入门教程&技术文档

猿材料

各种工具精挑细选

猿代码

源码市场，正版源码

猿分空间

软件外包对接平台

知识题库

知识闯关节节高，刷题涨知识！

阶段练习

单元测试知识学习状况秒掌握！

期末考试

期末测试，学习情况即刻知道！

面试题库

最新的企业技术人员招聘真题练习！

Java专区

2948篇 ｜ 24.5万人浏览

Python专区

2593篇 ｜ 19.5万人浏览

大数据专区

2948篇 ｜ 18.5万人浏览

PHP专区

3953篇 ｜ 27.5万人浏览

Go专区

1382篇 ｜ 12.5万人浏览

Web前端专区

1453篇 ｜ 31.5万人浏览

Linux云计算

1230篇 ｜ 4.5万人浏览

其他专区

53232篇文章 ｜ 11.5万人浏览

搜索

历史记录 清除记录

近期热搜

项目开发全程实录（电商EW_Shop）

8713 人 2年前

轻松学会Laravel-项目篇（商城API）

2030 人 2年前

Python数据分析2.0-金融

329 人 3年前

Python办公自动化2.0

243 人 3年前

使用账号登录

启用更安全省心的  微信登录

Java开发工程师

何以解忧，唯有 Java！

Python开发工程师

菜单学习猿地 - LMONKEY

尊享10项VIP特权持续新增

2948篇｜ 24.5万人浏览

2593篇｜ 19.5万人浏览

2948篇｜ 18.5万人浏览

3953篇｜ 27.5万人浏览

1382篇｜ 12.5万人浏览

1453篇｜ 31.5万人浏览

1230篇｜ 4.5万人浏览

53232篇文章｜ 11.5万人浏览

历史记录清除记录