JSF页面组件化

来源：互联网发布：c语言输出钻石图案编辑：程序博客网时间：2024/04/28 23:13

页面组件化能带来很多优点，当多个页面引用同一个页面，这样，我们就只需要维护一个页面的代码，大大减轻开发人员的工作量。

假设网站的根目录为jsfApp，建立jsfApp/resources/echo目录，resources为默认的需要组件化的页面的根目录，echo为组件的前缀。

第一步

新增jsfApp/resources/echo/echoInputText.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:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"xmlns:c="http://java.sun.com/jsp/jstl/core"xmlns:composite="http://java.sun.com/jsf/composite"><h:head><title>myjsf</title><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /></h:head><!--  INTERFACE  --><composite:interface><composite:attribute name="echo" /></composite:interface><!--  IMPLEMENTATION  --><composite:implementation><div style="padding: 20px;"><span>请输入响应文字：</span><h:inputText value="#{cc.attrs.echo.echoText}"></h:inputText></div></composite:implementation></html>

注意

xmlns:composite="http://java.sun.com/jsf/composite"

声明页面组件必须用到composite名字空间。

<composite:interface>

传入的参数。

<composite:implementation>

真正组件中的内容。

第二步

新增jsfApp/echo2.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:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"xmlns:c="http://java.sun.com/jsp/jstl/core"xmlns:echo="http://java.sun.com/jsf/composite/echo"><h:head><title>myjsf</title><meta http-equiv="Content-Type" content="text/html;charset=utf-8" /></h:head><body><div id="header"style="padding: 100px 0 20px 100px; font-size: 22px; font-weight: bold; border-bottom: solid 1px red">这个应声器的作者是：#{inputEcho.encoder.author}。</div><div><h:form id="form" style="padding:20px  0  20px  100px"><echo:echoInputText echo="#{inputEcho}"></echo:echoInputText><div style="padding-left: 50px"><h:commandButton id="post" style="padding:3px;width:100px;"value="提交响应" action="echo2" /></div></h:form></div><h:panelGroup id="after"><div style="padding: 20px 0 0 100px">响应：<h:outputText id="echo" value="#{inputEcho.outText}" escape="false"></h:outputText></div></h:panelGroup></body></html>

使用echo前缀

xmlns:echo="http://java.sun.com/jsf/composite/echo"

使用echoInputText页面，并传入echo参数

<echo:echoInputText echo="#{inputEcho}"></echo:echoInputText>

Bean及工具类如下：

@ManagedBean(name="inputEcho") @SessionScopedpublic class InputEcho implements Serializable {/** *  */private static final long serialVersionUID = 7599540489637124942L;private  String  echoText = "";    private  EchoEncoder  encoder;         public  InputEcho()  {         encoder  =  new  EchoEncoder();     }     /**       *  @return  the  encoder       */     public  EchoEncoder  getEncoder()  {         return  encoder;     }     /**       *  @return  the  echoText       */     public  String  getEchoText()  {         return  echoText;     }          public  String  getOutText()  {         return  encoder.Encode(echoText);     }     /**       *  @param  echoText  the  echoText  to  set       */     public  void  setEchoText(String  echoText)  {         this.echoText  =  echoText;     }          public  void  echo()  {     }}

package com.zolcorp.myjsf.bean;import java.io.Serializable;public class EchoEncoder implements Serializable {/** *  */private static final long serialVersionUID = -5578888194809870790L;private String author = "pout";        /**       * @return the author      */     public String getAuthor() {         return author;     }     public String Encode(String msg) {    if(msg == null)    return null;        return msg.replaceAll("<", "<").replaceAll(">", ">").replaceAll("\n", "<br/>");     }}

页面组件化能大大减少维护的工作量。JSF2里配置也很简单。