【问题标题】:How to render a custom attribute of <h:outputLink>?如何呈现 <h:outputLink> 的自定义属性?
【发布时间】:2012-05-28 21:18:05
【问题描述】:

我正在尝试使用如下所示的 sn-p 来实现 pinterest 的 pinit 按钮:

<h:outputLink value="http://pinterest.com/pin/create/button/" class="pin-it-button" count-layout="horizontal">
   <f:param name="url" value="#{beanOne.someMethod}/sometext{prettyContext.requestURL.toURL()}"/>
   <f:param name="media" value="#{beanOne.someOtherMethod}/sometext/somemoretext/#{beanTwo.someMethodTwo}-some-text.jpg"/>
   <f:param name="description" value="#{beanTwo.someOtherMethodTwo}"/>
   <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
</h:outputLink>

以下是陷阱:

  • 整个标记是由来自两个不同 bean 的四种不同方法以及一些静态文本的组合创建的
  • url 参数显然需要进行 urlencoded,因此我在 h:outputLink 中使用 f:param 以便它们得到 urlencoded
  • 生成的a标签需要有非标准的count-layout="horizontal"属性

现在我的问题是以下之一:

  • 如何将 count-layout 属性注入到 h:outputLink 或生成的锚标记中
  • 否则,如果我不能,还有什么是另一种非侵入性(我不想更改 bean 方法)的方式来完成所需的 pinit 按钮标记?

可以在http://pinterest.com/about/goodies/ 下方的“网站固定按钮”部分找到所需的标记。

【问题讨论】:

    标签: jsf facelets pinterest


    【解决方案1】:

    要么使用一个普通的&lt;a&gt; 元素和一个custom EL function,它代表URLEncoder#encode()

    <c:set var="url" value="#{beanOne.someMethod}/sometext#{prettyContext.requestURL.toURL()}"/>
    <c:set var="media" value="#{beanOne.someOtherMethod}/sometext/somemoretext/#{beanTwo.someMethodTwo}-some-text.jpg"/>
    <c:set var="description" value="#{beanTwo.someOtherMethodTwo}"/>
    
    <a href="http://pinterest.com/pin/create/button/?url=#{utils:encodeURL(url)}&amp;media=#{utils:encodeURL(media)}&amp;description=#{utils:encodeURL(description)}" class="pin-it-button" count-layout="horizontal">
       <img border="0" src="//assets.pinterest.com/images/PinExt.png" title="Pin It" />
    </a>
    

    (注意class 属性对&lt;h:outputLink&gt; 无效,您应该使用styleClass

    或者为&lt;h:outputLink&gt; 创建一个自定义渲染器,增加对count-layout 属性的支持。假设您使用的是 Mojarra,最简单的方法是扩展其 OutputLinkRenderer

    public class ExtendedLinkRenderer extends OutputLinkRenderer {
    
        @Override
        protected void writeCommonLinkAttributes(ResponseWriter writer, UIComponent component) throws IOException {
            super.writeCommonLinkAttributes(writer, component);
            writer.writeAttribute("count-layout", component.getAttributes().get("count-layout"), null);
        }
    
    }
    

    要让它运行,在faces-config.xml注册它如下:

    <render-kit>
        <renderer>
            <component-family>javax.faces.Output</component-family>
            <renderer-type>javax.faces.Link</renderer-type>
            <renderer-class>com.example.ExtendedLinkRenderer</renderer-class>
        </renderer>
    </render-kit>
    

    【讨论】:

    • 自定义渲染器看起来更简洁,并为未来的需求留出了空间。非常感谢。
    • 不客气。请注意,您以这种方式依赖 JSF 实现。如果你曾经切换到 MyFaces,你必须改变它。您也可以创建一个独立的渲染器,但这需要大量非 DRY 样板代码。
    猜你喜欢
    • 1970-01-01
    • 2013-05-16
    • 2012-10-05
    • 2012-05-05
    • 1970-01-01
    相关资源
    最近更新 更多