Question

我必须在里面写一个带图像的链接。而不是解释，这是我现在的代码：

<c:if test="${userSession.loggedUser eq null and company.image != null}">
    <a onclick="${rich:component('loginPanel')}.show()">
        <img src="/download.do?hash=#{company.image.hash}" />
    </a>
</c:if>
<c:if test="${userSession.loggedUser eq null and company.image == null}">
    <a onclick="${rich:component('loginPanel')}.show()">
        <img src="${request.contextPath}/img/icons/logo_default.jpg" />
    </a>
</c:if>
<c:if test="${userSession.loggedUser ne null and company.image != null}">
    <a href="company.xhtml?${company.name}">
        <img src="/download.do?hash=#{company.image.hash}" />
    </a>
</c:if>
<c:if test="#{userSession.loggedUser ne null and company.image == null}">
    <a href="company.xhtml?${company.name}">
        <img src="${request.contextPath}/img/icons/logo_default.jpg" />
    </a>
</c:if>

这段代码看起来很糟糕 - 有两个确切的链接有两个精确的图像，但是在所有可能的组合中组合在一起。有没有更好的办法？有没有办法避免c：if - 它创建了表吗？

更新：Bozho建议：您可以将<c:if和<a替换为<h:outputLink rendered="#{..}"。除此之外，我没有看到任何其他优化。

但它不起作用。这无法正确呈现：

<a href=>
<h:outputLink rendered="#{..}
<h:outputLink rendered="#{..}
</a>

（图像在锚之外）

这确实很好：

<h:outputLink value=>
<h:outputLink rendered="#{..}
<h:outputLink rendered="#{..}
</a>

，但它总是添加href，在两种情况下，我不想在渲染时使用href。

Update2 ：我还将它们合并为2比2：

<c:if>
  <a href...>
    <c:if><img...></c:if>
    <c:if><img...></c:if>
  </a>
</c:if>
<c:if>
  <a onclick...>
    <c:if><img...></c:if>
    <c:if><img...></c:if>
  </a>
</c:if>

这也无法正确渲染 - 由于某些疯狂的原因，<a不会围绕图像。

Answer 1

这个怎么样？

<c:set var="isLoggedIn" value="#{userSession.loggedUser != null}" />
<c:set var="showPage" value="company.xhtml?#{company.name}" />
<c:set var="showLogin" value="javascript:${rich:component('loginPanel')}.show()" />
<c:set var="hasImage" value="#{company.image != null}" />
<c:set var="companyImage" value="/download.do?hash=#{company.image.hash}" />
<c:set var="defaultImage" value="#{request.contextPath}/img/icons/logo_default.jpg" />

<a href="#{isLoggedIn ? showPage : showLogin}">
    <img src="#{hasImage ? companyImage : defaultImage}" />
</a>

这可以缩短如下（快速阅读/解释会有点麻烦）：

<c:set var="showPage" value="company.xhtml?#{company.name}" />
<c:set var="companyImage" value="/download.do?hash=#{company.image.hash}" />
<c:set var="defaultImage" value="#{request.contextPath}/img/icons/logo_default.jpg" />

<a href="#{userSession.loggedUser != null ? showPage : 'javascript:${rich:component(\'loginPanel\')}.show()'}">
    <img src="#{company.image != null ? companyImage : defaultImage}" />
</a>

Answer 2

您可以将<c:if和<a替换为<h:outputLink rendered="#{..}" 或<c:if与<h:panelGroup rendered="#{..}">（为了更多jsf-ish）

为了减少重复，您可以创建一个单独的页面：

<h:panelGroup rendered="#{condition}">
    <a onclick="${rich:component('loginPanel')}.show()">
        <img src="#{imgSrc}" />
    </a>
</h:panelGroup>

然后<ui:include>使用正确的<ui:param>。 onclick / href之间的切换可以通过另一个参数完成，并有条件地显示<a个标签之一。

Answer 3

你想创建链接取决于3个参数：test，href和src。您可以创建自己的标签。

<强>编辑：或者下一个解决方案：您可以注意到，总是只生成一个链接，所以我会改变是否切换并执行以下操作：

<c:set var="loggedUser" value="${userSession.loggedUser eq null}" />
<c:set var="isCompanyImage" value="${company.image != null}" />

<c:choose>
    <c:when test="${loggedUser && isCompanyImage}">
        <c:set var="aPart">onclick="${rich:component('loginPanel')}.show()"</c:set>
        <c:set var="imgPart">/download.do?hash=#{company.image.hash}</c:set>
    </c:when>
    ...
</c:choose>

<a ${aPart}><img src="${imgPart}" /></a>

Answer 4

我这样做了：

<c:set var="companyImage" value="/download.do..." />
<c:set var="defaultImage" value="logo_default.jpg" />

<c:if test="${userSession.loggedUser == null}">
    <a onclick="${rich:component('loginPanel')}.show()">
        <img
            src="#{company.image != null ? companyImage : defaultImage}"
            alt="logo"
            width="84"
            height="42"
            class="th_user"
        />
    </a>
</c:if>
<c:if test="${userSession.loggedUser != null}">
    <a href="companyUrl.jsf">
        <img
            src="#{company.image != null ? companyImage : defaultImage}"
            alt="logo"
            width="84"
            height="42"
            class="th_user"
        />
    </a>
</c:if>

它并不漂亮，因为图像的所有属性仍然存在两次，但我浪费了太多时间。如果有人想到更好的东西，请分享。

Answer 5

你有没有尝试过：

<h:link value="#{}" onclick="..." rendered="#{not empty sessionScope.loggedUser and not empty company.image}">
    <h:graphicImage value="#{requestScope.contextPath}/img/icons/logo_default.jpg" />
    <f:param name="company" value="#{company.name}" />  
</h:link>

我想告诉你的是和标签。只是玩一点吧:)应该没问题来解决你的问题。

重构链接和图像

5 个答案: