所有孩子的递归菜单答案

【问题标题】：Recursive menu of all children所有孩子的递归菜单
【发布时间】：2019-09-11 04:24:45
【问题描述】：

我正在尝试生成站点树中所有页面的嵌套菜单。

docs 显示两个级别 - 我不知道有多少级别。

目前我知道在某一点上至少有四个层次，所以我有这个：

<ul>
<% loop $Menu(1) %>
    <li>
        <a href="$Link" title="Go to the $Title page" class="<% if $isCurrent %>current<% else_if $isSection %>section<% end_if %>">
            $MenuTitle
        </a>

        <% if $Children %>
        <ul>
        <% loop $Children %>
            <li class="<% if $isCurrent %>current<% else_if $isSection %>section<% end_if %>">
                <a href="$Link">$MenuTitle</a>

                <% if $Children %>
                <ul>
                <% loop $Children %>
                    <li class="<% if $isCurrent %>current<% else_if $isSection %>section<% end_if %>">
                        <a href="$Link">$MenuTitle</a>

                        <% if $Children %>
                        <ul>
                        <% loop $Children %>
                            <li class="<% if $isCurrent %>current<% else_if $isSection %>section<% end_if %>">
                                <a href="$Link">$MenuTitle</a>
                            </li>
                        <% end_loop %>
                        </ul>
                        <% end_if %>

                    </li>
                <% end_loop %>
                </ul>
                <% end_if %>

            </li>
        <% end_loop %>
        </ul>
        <% end_if %>

    </li>
<% end_loop %>
</ul>

它有效但不可靠（如果编辑器添加了另一个级别）。这很笨拙。有递归选项吗？

【问题讨论】：

标签： silverstripe silverstripe-4

【解决方案1】：

我们可以创建一个递归菜单项模板来创建一个与站点树一样深的菜单。

首先我们在主题的Includes 目录中创建一个MenuItem.ss 模板文件。在此模板中，我们显示菜单项链接并检查是否有任何子页面。我们遍历所有子页面并为每个子页面添加MenuItem.ss 模板：

包括/MenuItem.ss

<li class="$LinkingMode">
    <a href="$Link" aria-label="Go to the $Title.XML page">$MenuTitle</a>

    <% if $Children %>
    <ul>
        <% loop $Children %>
        <% include Includes/MenuItem %>
        <% end_loop %>
    </ul>
    <% end_if %>
</li>

模板中的主菜单代码如下：

<nav class="main-menu">
    <ul>
        <% loop $Menu(1) %>
        <% include Includes/MenuItem %>
        <% end_loop %>
    </ul>
</nav>

【讨论】：