自定义渲染器添加的自定义属性显示在错误的HTML元素上

Question

我必须为<h:commandLink/>标签编写自定义渲染器以支持data-* HTML5属性，以便将JSF 2.1与jQuery移动框架一起使用。

我的JSF标记和此标记生成的输出如下：

          <h:commandLink value="Prev" data-theme="e" data-role="button" data-inline="true" data-mini="true" data-icon="arrow-l"/>
           <h:commandLink value="Page 1 of 3" data-theme="e" data-role="button" data-inline="true" data-mini="true"/>
           <h:commandLink value="Next" data-theme="e" data-role="button" data-inline="true" data-mini="true" data-icon="arrow-r" data-iconpos="right"/>

很明显，我的自定义渲染器正确渲染了第二个和第三个<h:commandLink/>标记，但不是第一个。 似乎属于第一个标记的data-*属性使用直接父<div/>标记呈现。 这似乎是Mojarra的一种奇怪的（和错误的）行为（我使用的是V 2.1.11 ）。 请告诉我如何克服这个问题？

我的自定义渲染器代码如下：

public class MyCommandLinkRenderer extends CommandLinkRenderer {

    @Override
    public void encodeBegin(FacesContext context, UIComponent component) {

        String[] attributes = {"data-theme", "data-role", "data-icon", "data-inline", "data-mini", "data-iconpos"};

        ResponseWriter writer = context.getResponseWriter();
        try {
            for (String attribute : attributes) {
                String value = (String) component.getAttributes().get(attribute);
                if (value != null) {
                    writer.writeAttribute(attribute, value, attribute);
                    System.out.println(attribute + " " + value);
                }
            }
            super.encodeBegin(context, component);
        } catch (Exception e) {
        }
    }
}

Answer 1

在编写属性之前，必须调用super.encodeBegin() 。

否则，您正在将属性写入先前的HTML元素，这由生成的HTML输出确认。 super.encodeBegin()启动新的HTML元素。

这只是您自己代码中的错误，而不是Mojarra中的错误。

---

更新 ：同样，重写encodeBegin()并不是第一位的。 您应该覆盖LinkRenderer#writeCommonLinkAttributes()方法。

@Override
protected void writeCommonLinkAttributes(ResponseWriter writer, UIComponent component) throws IOException {
    super.writeCommonLinkAttributes(writer, component);

    // ...
}

顺便说一句，如果你在工作之前或之后打电话给super ，那就无所谓了。