如何使用速度制作多层次的Liferay菜单

How to make multilevels Liferay menu with Velocity?

本文关键字：Liferay 菜单 多层次 何使用 速度      更新时间：2023-09-26

我尝试用Velocity制作新的Liferay主题。我想制作多层次菜单。我可以用这样的手制作关卡：

    <ul class="obsm">
    #foreach ($nav_item in $nav_items)
        #if ($nav_item.isSelected())
            <li class="active">
        #else
            <li>
        #end
            <a href="$nav_item.getURL()" $nav_item.getTarget()><span>$nav_item.icon() $nav_item.getName()</span></a>
            #if ($nav_item.hasChildren())
                <ul>
                    #foreach ($nav_child in $nav_item.getChildren())
                        #if ($nav_child.isSelected())
                            <li class="active">
                        #else
                            <li>
                        #end
                            <a href="$nav_child.getURL()" $nav_child.getTarget()>$nav_child.getName()</a>
                            #if ($nav_child.hasChildren())
                                <ul>
                                    #foreach ($nav_child in $nav_child.getChildren())
                                        #if ($nav_child.isSelected())
                                            <li class="active">
                                        #else
                                            <li>
                                        #end
                                            <a href="$nav_child.getURL()" $nav_child.getTarget()>$nav_child.getName()</a>
                                        </li>
                                    #end
                                </ul>
                            #end
                        </li>
                    #end
                </ul>
            #end
        </li><br>
    #end
</ul>

有3个级别的菜单。但它不好。我想制作无限级别菜单。可能吗？

我建议创建一个速度宏并递归调用它。这样：

#macro ( navigation $list )
    #foreach ( $item in $list )
        //code
        #if ( $item.hasChilden() )
            #navigation ( $item.getChildren() )
        #end
    #end    
#end

请参阅：http://velocity.apache.org/engine/releases/velocity-1.5/user-guide.html#velocimacros

我有另一个解决方案 

<nav class="$nav_css_class header-menu" id="navigation" role="navigation">
#set ($nav_item_selected="")
#set ($nav_item_2level_selected="")
#set ($nav_item_3level_selected="")
<ul class="menu-level-01" aria-label="#language ("site-pages")" role="menubar">
    #foreach ($nav_item in $nav_items)
        #set ($nav_item_attr_has_popup="")
        #set ($nav_item_attr_selected="")
        #set ($nav_item_css_class = "")
        #set ($nav_item_css_class_active = "")
        #if ($nav_item.isSelected())
            #set ($nav_item_attr_selected="aria-selected='true'")
            #set ($nav_item_css_class = "selected")
            #set ($nav_item_css_class_active = "active")
            #set ($nav_item_selected = $nav_item)
        #end
        #if ($nav_item.hasChildren())
            #set ($nav_item_attr_has_popup="aria-haspopup='true'")
        #end
        <li class="$nav_item_css_class $nav_item_css_class_active" id="layout_$nav_item.getLayoutId()" $nav_item_attr_selected role="presentation">
            <a aria-labelledby="layout_$nav_item.getLayoutId()" href="$nav_item.getURL()" $nav_item_attr_has_popup $nav_item.getTarget() role="menuitem"><span>$nav_item.icon() $nav_item.getName()</span></a>
        </li>
    #end
</ul>
#if ($nav_item_selected)
    #if ($nav_item_selected.hasChildren())
        <ul class="menu-level-02" aria-label="#language ("site-pages")" role="menubar">
            #foreach ($nav_item_2level in $nav_item_selected.getChildren())
                #set ($nav_item_2level_attr_selected="")
                #set ($nav_item_2level_css_class = "false")
                #set ($nav_item_2level_css_class_active = "")
                #if ($nav_item_2level.isSelected())
                    #set ($nav_item_2level_attr_selected="aria-selected='true'")
                    #set ($nav_item_2level_css_class = "selected")
                    #set ($nav_item_2level_css_class_active = "active")
                    #set ($nav_item_2level_selected = $nav_item_2level)
                #end
                #if ($nav_item_2level.hasChildren())
                    #set ($nav_item_2level_attr_has_popup="aria-haspopup='true'")
                #end
                <li class="$nav_item_2level_css_class $nav_item_2level_css_class_active" id="layout_$nav_item_2level.getLayoutId()" $nav_item_2level_attr_selected role="presentation">
                    <a aria-labelledby="layout_$nav_item_2level.getLayoutId()" href="$nav_item_2level.getURL()" $nav_item_2level_attr_has_popup $nav_item_2level.getTarget() role="menuitem"><span>$nav_item_2level.icon() $nav_item_2level.getName()</span></a>
                </li>
            #end
        </ul>
        #if ($nav_item_2level_selected.hasChildren())
            <ul class="menu-level-03" aria-label="#language ("site-pages")" role="menubar">
                #foreach ($nav_item_3level in $nav_item_2level_selected.getChildren())
                    #set ($nav_item_3level_attr_selected="")
                    #set ($nav_item_3level_css_class = "false")
                    #set ($nav_item_3level_css_class_active = "")
                    #if ($nav_item_3level.isSelected())
                        #set ($nav_item_3level_attr_selected="aria-selected='true'")
                        #set ($nav_item_3level_css_class = "selected")
                        #set ($nav_item_3level_css_class_active = "active")
                        #set ($nav_item_3level_selected = $nav_item_3level)
                    #end
                    #if ($nav_item_3level.hasChildren())
                        #set ($nav_item_3level_attr_has_popup="aria-haspopup='true'")
                    #end
                    <li class="$nav_item_3level_css_class $nav_item_3level_css_class_active" id="layout_$nav_item_3level.getLayoutId()" $nav_item_3level_attr_selected role="presentation">
                        <a aria-labelledby="layout_$nav_item_3level.getLayoutId()" href="$nav_item_3level.getURL()" $nav_item_3level_attr_has_popup $nav_item_3level.getTarget() role="menuitem"><span>$nav_item_3level.icon() $nav_item_3level.getName()</span></a>
                    </li>
                #end
            </ul>   
        #end    
    #end    
#end

相关文章：