FluidTYPO3 在 TYPO3 后端使用 Flux Grid 复制内容模块

Question

我正在使用TYPO3 7.6和最新的Flux-、VHS- 和FluidcontentExtensions (FluidTYPO3)。我写了一个新的 FLUX-Content 元素，一个来自Zurb Foundation 6 的 Tab-Container。 该元素工作正常（前端），但在后端我有一行有我的选项卡和列.. sth。会复制我的标签和里面的内容吗？！已清除缓存。

这是一个屏幕截图。 Tab-Elements会被复制，不知道为什么？

我的 FLUX FCE：

<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
    xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
    xmlns:flux="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers"
    xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers">

    <f:layout name="Content" />

    <f:section name="Configuration">
        <flux:form id="tabs" options="{group: 'LLL:typo3conf/ext/myelements/Resources/Private/Language/locallang.xlf:grid.elements'}">

            <flux:form.sheet name="tabs">
                <flux:form.section name="tabs">
                    <flux:form.object name="tab">

                        <flux:field.input name="title" />
                        <flux:field.input name="class" />
                        <flux:field.checkbox name="active" />

                    </flux:form.object>
                </flux:form.section>
            </flux:form.sheet>

            <flux:grid>
                <flux:grid.row>
                    <f:if condition="{tabs}">
                        <f:for each="{tabs}" as="tab" iteration="iteration">
                                <flux:form.content name="content.{iteration.index}" label="Tab {iteration.cycle}" />
                        </f:for>
                    </f:if>
                </flux:grid.row>
            </flux:grid>

        </flux:form>
    </f:section>



    <f:section name="Preview">
        <flux:widget.grid />
    </f:section>



    <f:section name="Main">

        <f:render section="Tabs" arguments="{_all}" />

        <div class="tabs-content" data-tabs-content="tabs-{record.uid}">
            <f:if condition="{tabs}">
                <f:for each="{tabs}" as="tab" iteration="iteration">
                    <div class="tabs-panel {f:if(condition: '{tab.tab.active} == 1', then: 'is-active')}" id="panel-{record.uid}-{iteration.index}">
                        <flux:content.render area="content.{iteration.index}" />
                    </div>
                </f:for>
            </f:if>
        </div>

    </f:section>



    <f:section name="Tabs">

        <f:if condition="{tabs}">

            <ul class="tabs" data-tabs id="tabs-{record.uid}">
                <f:for each="{tabs}" as="tab" iteration="iteration">
                    <li class="tabs-title {f:if(condition: '{tab.tab.active} == 1', then: 'is-active')}">
                        <a href="#panel-{record.uid}-{iteration.index}" aria-selected="true">{tab.tab.title}</a>
                    </li>
                </f:for>
            </ul>

        </f:if>

    </f:section>

</div>

Answer 1

这就是问题所在：

<flux:widget.grid />

根据Release Notes of flux 7.2：

已替换预览小部件

我们已经替换了 Flux 在 Grid 生成预览时的方式 涉及。之前，Flux 会从 Fluid 模板渲染 Grid 文件，这意味着模板必须被解析（或从 编译缓存）然后渲染，涉及大量 加工。内容元素容器区域现在由 特殊的视图类，工作时显着提高性能 具有多个嵌套元素。

新行为：

• 在页面模块中将 Grid 呈现为内容元素容器，如果您 模板定义一个，无论您是否有预览 部分。

• 弃用不再有任何功能的flux:widget.grid。

• 删除所有对设置用于渲染的流体模板的支持 网格。

基本上，我们牺牲了很少使用的模板替换 在非常频繁执行的代码中提高性能的功能。

因此，只需从模板中删除完整的 Preview 部分。

Answer 2

谢谢维克托。

必须从您的模板中删除 all flux.grid-stuff。 整个预览部分和配置部分的一些网格/行。

这是flux和zurb foundation的正确标签模板：

<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
    xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"
    xmlns:flux="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers"
    xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers">

    <f:layout name="Content" />

    <f:section name="Configuration">
        <flux:form id="Tabs" options="{group: 'LLL:typo3conf/ext/customerproject/Resources/Private/Language/locallang.xlf:grid.elements'}">

            <flux:form.sheet name="tabs">
                <flux:form.section name="tabs">
                    <flux:form.object name="tab">

                        <flux:field.input name="title" />
                        <flux:field.input name="class" />
                        <flux:field.checkbox name="active" />

                    </flux:form.object>
                </flux:form.section>
            </flux:form.sheet>


            <f:if condition="{tabs}">
                <f:for each="{tabs}" as="tab" iteration="iteration">
                        <flux:form.content name="content.{iteration.index}" label="Tab {iteration.cycle}" />
                </f:for>
            </f:if>


        </flux:form>
    </f:section>






    <f:section name="Main">
        <div class="flux grid01Tabs">

            <f:render section="Tabs" arguments="{_all}" />

            <div class="tabs-content" data-tabs-content="tabs-{record.uid}">
                <f:if condition="{tabs}">
                    <f:for each="{tabs}" as="tab" iteration="iteration">
                        <div class="tabs-panel {f:if(condition: '{tab.tab.active} == 1', then: 'is-active')}" id="panel-{record.uid}-{iteration.index}">
                            <flux:content.render area="content.{iteration.index}" />
                        </div>
                    </f:for>
                </f:if>
            </div>

        </div><!-- / tabWrap -->
    </f:section>



    <f:section name="Tabs">

        <f:if condition="{tabs}">

            <ul class="tabs" data-tabs id="tabs-{record.uid}">
                <f:for each="{tabs}" as="tab" iteration="iteration">
                    <li class="tabs-title {f:if(condition: '{tab.tab.active} == 1', then: 'is-active')}">
                        <a href="#panel-{record.uid}-{iteration.index}" aria-selected="true">{tab.tab.title}</a>
                    </li>
                </f:for>
            </ul>

        </f:if>

    </f:section>

</div>