<th:block th:fragment="nav-menu-recursion(menuItem)">
    <!-- 有子菜单则显示子菜单 -->
    <th:block th:if="${not #lists.isEmpty(menuItem.children)}">
        <!-- 子菜单 -->
        <div class="menus_item_child" th:classappend="${#annotations.get(menuItem,'isVertical')=='1'?'vertical_nav':''}">
            <div class="recursion_menus_item" th:each="childMenu : ${menuItem.children}">
                <a class="site-page child" th:target="${childMenu.spec.target?.value}" th:href="@{${childMenu.status.href}}">
                    <i th:if="${!#strings.isEmpty(#annotations.getOrDefault(childMenu, 'icon', ''))}"
                       th:class="${#annotations.getOrDefault(childMenu, 'icon', '')}"
                       style="font-size:.9em"></i>
                    <span th:text="${childMenu.status.displayName}"></span>
                </a>
                <!--递归调用-->
                <div th:replace="~{modules/widgets/nav-menu :: nav-menu-recursion(menuItem=${childMenu})}"></div>
            </div>
        </div>
    </th:block>
</th:block>

<!-- 导航栏菜单栏 -->
<div id="menus" th:fragment="nav-menu">

    <div class="menus_items">

        <!-- 第一层仅展示使用，不做跳转 -->
        <div class="menus_item" th:each="menuItem : ${menuFinder.getPrimary().menuItems}">

            <!-- javascript:void(0);" -->
            <a class="site-page" rel="external nofollow"
               th:if="${#lists.isEmpty(menuItem.children)}"
               th:target="${menuItem.spec.target?.value}"
               th:href="@{${menuItem.status.href}}">
                <span th:text="${menuItem.status.displayName}"></span>
            </a>

            <a th:if="${not #lists.isEmpty(menuItem.children)}" class="site-page" rel="external nofollow">
                <span th:text="${menuItem.status.displayName}"></span>
            </a>
            <!--递归调用-->
            <div th:replace="~{modules/widgets/nav-menu :: nav-menu-recursion(menuItem=${menuItem})}"></div>
        </div>

    </div>
</div>