Подстраницы не отображаются как дети в mainnavigation (Typo3) - PullRequest
0 голосов
/ 24 мая 2019

У меня есть несколько страниц с подстраницами в моем дереве страниц, как показано ниже.

Мое дерево страниц с подстраницами

Однако ссылки на подстраницы, похоже, некликабельны.

Я реализовал навигацию в Fluid в соответствии с приведенным ниже кодом (который находится в файле default.html в папке «Макеты»):

<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <a class="navbar-brand" href="{rl}">Company Name</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>


    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
            <f:for each="{mainnavigation}" as="mainnavigationItem">
                <f:if condition="{mainnavigationItem.children}">
                    <f:then>
                        <li class="nav-item {f:if(condition: mainnavigationItem.active, then:'active')} dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                {mainnavigationItem.title}
                            </a>
                            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                                <f:for each="{mainnavigationItem.children}" as="child">
                                    <a class="dropdown-item" href="{child.link}" target="{child.target}" title="{child.title}">{child.title}</a>
                                </f:for>
                            </div>
                        </li>
                    </f:then>
                    <f:else>
                        <li class="nav-item {f:if(condition: mainnavigationItem.active, then:'active')}">
                            <a class="nav-link" href="{mainnavigationItem.link}" target="{mainnavigationItem.target}" title="{mainnavigationItem.title}">{mainnavigationItem.title} <span class="sr-only">(current)</span></a>
                        </li>
                    </f:else>
                </f:if>
            </f:for>
        </ul>
    </div>
</nav>

И переменная mainnavigation определена вконфигурация моего расширения в setup.typoscript, как показано ниже.Обратите внимание, что уровни установлены на 2, чтобы отобразить подстраницы.

  dataProcessing {
            10 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
            10 {
                references.fieldName = media
            }
            20 = TYPO3\CMS\Frontend\DataProcessing\MenuProcessor
            20 {
                levels = 2
                includeSpacer = 1
                as = mainnavigation
            }
        }

Как видно на рисунке ниже, для подстраниц добавлена ​​стрелка.Когда я нажимаю эту стрелку или заголовок страницы, ничего не происходит, однако.

Меню с выпадающими списками

Дополнительно, я получаю эту ошибку в веб-консоли:

Uncaught TypeError: Cannot read property 'fn' of undefined
at util.js:55
at bootstrap.min.js:6
at bootstrap.min.js:6

Что относится к:

$.fn.emulateTransitionEnd = transitionEndEmulator

Ответы [ 3 ]

0 голосов
/ 31 мая 2019

В вашем HTML-коде есть синтаксическая ошибка.

Ваш код:

<a class="dropdown-item" href="{child.link}" target="{child.target}" title="{child.title}>{child.title}</a>

Должно быть:

<a class="dropdown-item" href="{child.link}" target="{child.target}" title="{child.title}">{child.title}</a>

Отсутствует " после {child.title}, поэтому неправильно закрывается.

0 голосов
/ 15 июня 2019

Оказывается, я неправильно импортировал JQuery в setup.typoscript.После того, как я добавил следующий код на страницу, страницы всплыли правильно:

 includeJSFooter {
   jquery = https://code.jquery.com/jquery-3.3.1.slim.min.js
   jquery.external = 1
   popper = https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js
   popper.external = 1
   bootstrap = https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js
   bootstrap.external = 1

}
0 голосов
/ 24 мая 2019

Вы должны взглянуть на свои настройки - там вы можете определить навигацию, см. Также здесь

...