📄 使用自订组件.htm
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 1</title>
</head>
<body>
<p>使用自订组件</p>
<div id="PageContent">
<table cellSpacing="0" cellPadding="0" width="100%" border="0" id="table3">
<tr>
<td class="pagebody" vAlign="top">
<table style="CLEAR: both" cellSpacing="0" cellPadding="0" width="100%" border="0" id="table4">
<tr>
<td class="pagecontent" vAlign="top" width="100%">
<div class="wiki-content">
在Component与Tag自订完成后，这边来看看如何使用它们，首先定义faces-config.xml：<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeHeader" style="BORDER-BOTTOM-STYLE: solid">
<b>faces-config.xml</b></div>
<div class="codeContent">
<pre class="code-java"><?xml version=<span class="code-quote">"1.0"</span> encoding=<span class="code-quote">"UTF-8"</span>?>
<!DOCTYPE faces-config PUBLIC "-<span class="code-comment">//Sun Microsystems,
</span> Inc.<span class="code-comment">//DTD JavaServer Faces Config 1.0//EN"
</span> <span class="code-quote">"http:<span class="code-comment">//java.sun.com/dtd/web-facesconfig_1_0.dtd"</span>>
</span> <faces-config>
<component>
<component-type>
onlyfun.caterpillar.TextWithCmd
</component-type>
<component-class>
onlyfun.caterpillar.UITextWithCmd
</component-class>
</component>
<managed-bean>
<managed-bean-name>someBean</managed-bean-name>
<managed-bean-class>
onlyfun.caterpillar.SomeBean
</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
</managed-bean>
</faces-config></pre>
</div>
</div>
<p> <component>中定义Component的型态与实际的类别对应，在您于自订Tag中呼叫
getComponentType()方法所返回的值，就是寻找<component-type>设定的值对应，并由此得知真正对应的
Component类别。</p>
<p> 我们所撰写的SomeBean测试类别如下：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeHeader" style="BORDER-BOTTOM-STYLE: solid">
<b>SomeBean</b></div>
<div class="codeContent">
<pre class="code-java"><span class="code-keyword">package</span> onlyfun.caterpillar;
<span class="code-keyword">public</span> class SomeBean {
<span class="code-keyword">private</span> <span class="code-object">String</span> data;
<span class="code-keyword">public</span> <span class="code-object">String</span> getData() {
<span class="code-keyword">return</span> data;
}
<span class="code-keyword">public</span> void setData(<span class="code-object">String</span> data) {
<span class="code-keyword">this</span>.data = data;
}
}</pre>
</div>
</div>
<p> 这边写一个简单的网页来测试一下我们撰写的自订组件：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeHeader" style="BORDER-BOTTOM-STYLE: solid">
<b>index.jsp</b></div>
<div class="codeContent">
<pre class="code-java"><%@ taglib uri=<span class="code-quote">"http:<span class="code-comment">//java.sun.com/jsf/html"</span> prefix="h" %>
</span> <%@ taglib uri=<span class="code-quote">"http:<span class="code-comment">//java.sun.com/jsf/core"</span> prefix="f" %>
</span> <%@ taglib uri=<span class="code-quote">"/WEB-INF/textcmd.tld"</span> prefix=<span class="code-quote">"oc"</span> %>
<html>
<link href=<span class="code-quote">"styles.css"</span> rel=<span class="code-quote">"stylesheet"</span> type=<span class="code-quote">"text/css"</span>/>
<head>
<title></title>
</head>
<body>
<f:view>
<h:form>
Input data: <oc:textcmd size=<span class="code-quote">"10"</span>
value=<span class="code-quote">"#{someBean.data}"</span>/>
</h:form>
<h:outputText value=<span class="code-quote">"#{someBean.data}"</span>/>
</f:view>
</body>
</html></pre>
</div>
</div>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -