1

我尝试在一个简单的自定义组件中为页面链接设置动态 css 类值,但找不到任何方法。

我的组件...

<!-- my component template 'testLink' -->
<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd">
    <!-- maybe I can set here something dynamic like that ...
        <t:pagelink page="mytest" t:id="myLink" class="${myDynCss}">

        ... but in this case I need to pass the parameter what link is handled
    -->
    <t:pagelink page="mytest" t:id="myLink">
        I want dynamic css class            
    </t:pagelink>
</html>

组件java代码...

public class TestLink {
    @Parameter(required=true)
    private int activeId;

    @Component
    PageLink myLink;

    public int getActiveId() {
        return activeId;
    }

    public void setupRender()
    {
        // I try to set some class attribute here but I find no matching function in myLink
        // myLink.setCssStyle();
    }   

    public String getMyDynCss(int currentLinkId) {
        if (currentLinkId==activeId)
            return "active";
        else
            return "xxx";
    }
}

包含组件的页面...

<html t:type="layout" title="Test" xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
      xmlns:p="tapestry:parameter">
    <p:app_navigation>
        <t:testLink activeId="1000"/>
    </p:app_navigation>
</html>

也许是一个愚蠢的新手问题,但我仍然有问题要以 Tapestry 的方式思考。欢迎任何帮助或有用的提示。

4

2 回答 2

2

从您的代码中不太清楚 currentLinkId 和 activeId 之间的区别是什么以及 currentId 来自哪里。我几乎假设你有某种你没有在这里分享的循环设置。但是鉴于您可以从封闭组件中获取这些变量,您几乎在注释掉的代码中,您只需要从您的getMyDynCss()方法中删除参数。像这样:

爪哇:

public class TestLink {

    @Property
    @Parameter(required=true)
    private int activeId;

    @Property
    @Parameter(required=true)
    private int currentId;

    public String getMyDynCss() {
        if (currentId == activeId) {
            return "active";
        }
        else {
            return "xxx";
        }
    }
}

你的 tml:

<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd">
    <t:pagelink page="mytest" t:id="myLink" class="${myDynCss}">
</html>

您的封闭组件:

<html t:type="layout" title="Test" xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
      xmlns:p="tapestry:parameter">
    <p:app_navigation>
        <t:testLink activeId="1000" currentId="somePropertyFromSomewhere"/>
    </p:app_navigation>
</html>
于 2013-09-28T13:12:35.600 回答
1

我的解决方案使用生命周期事件。如果有任何链接的 id 代表活动 id(按照惯例),则将其标记为活动。

我的最终组件模板...

<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd">
    <!-- convention: id == 'm' + numeric value for active entry --> 
    <t:pagelink page="mytest" id="m1000">
        I'm active
    </t:pagelink>

    <t:pagelink page="mytest2" id="m1001">
        I'm not active
    </t:pagelink>
</html>

组件的java代码...

public class TestLink {
    @Parameter(required=true)
    private int activeId;

    // ... looking for a link with the active id ...
    void afterRender(final MarkupWriter writer) {
        // works only if the id follows the right convention :-D
        String activeElemId="m"+activeId; // <--
        Element activeLink=writer.getDocument().getElementById(activeElemId);
        if (activeLink!=null)
            activeLink.addClassName("active");
    }    
}

包含组件的代码...

<html t:type="layout" title="Test" xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
      xmlns:p="tapestry:parameter">
    <p:app_navigation>
        <t:testLink activeId="1000"/>
    </p:app_navigation>
</html>
于 2013-10-10T12:11:42.537 回答