TYPO3 Gridelements 使用 Fluidtemplate 渲染 FAL 图像

Question

我正在使用 TYPO3 8.7 和最新的扩展 gridelements (8.2.3)。现在我想在我的 FLUIDTEMPLATE 中显示/渲染图像.. - 但我不知道怎么做？!？

这是我的 TypoScript:

tt_content {
    gridelements_pi1 = COA
    gridelements_pi1 {
        20 {
            10 {
                setup {
                    SectionColoured < lib.gridelements.defaultGridSetup
                    SectionColoured {
                        cObject = FLUIDTEMPLATE
                        cObject {
                            file = EXT:myext/.../SectionColoured.html
                        }
                    }
                }
            }
        }
    }
}

现在，我通过 flexforms 上传图像(例如背景图像)，如下所示:

<backgroundimage type="array">
                        <TCEforms type="array">
                            <label>LLL:EXT:autefa/Resources/Private/Language/backend.xlf:gridelements.SectionColoured.flexforms.backgroundimage</label>
                            <config type="array">
                                <type>inline</type>
                                <maxitems>1</maxitems>
                                <foreign_table>sys_file_reference</foreign_table>
                                <!--<foreign_field>uid_foreign</foreign_field>-->
                                <foreign_table_field>tablenames</foreign_table_field>
                                <foreign_label>uid_local</foreign_label>
                                <foreign_sortby>sorting_foreign</foreign_sortby>
                                <foreign_selector>uid_local</foreign_selector>
                                <foreign_selector_fieldTcaOverride type="array">
                                    <config>
                                        <appearance>
                                            <elementBrowserType>file</elementBrowserType>
                                            <elementBrowserAllowed>jpg,png</elementBrowserAllowed>
                                        </appearance>
                                    </config>
                                </foreign_selector_fieldTcaOverride>
                                <foreign_match_fields type="array">
                                    <fieldname>image</fieldname>
                                </foreign_match_fields>
                                <appearance type="array">
                                    <newRecordLinkAddTitle>1</newRecordLinkAddTitle>
                                    <headerThumbnail>
                                        <field>uid_local</field>
                                        <height>64</height>
                                        <width>64</width>
                                    </headerThumbnail>
                                </appearance>
                            </config>
                        </TCEforms>
                    </backgroundimage>

到目前为止一切正常。如何在 FLUIDTEMPLATE 中使用图像？调试器在 {data.flexform_backgroundimage} 上返回 12 ?!

<f:debug>{data.flexform_backgroundimage}</f:debug>
<section class="main-content {data.flexform_farbe}">
    <article>
        <f:format.raw>{data.tx_gridelements_view_columns.101}</f:format.raw>
    </article>
</section>

调试 {data}..感谢您的帮助!

pi_flexform => array(1 item)
      data => array(1 item)
         general => array(1 item)
            lDEF => array(2 items)
               farbe => array(1 item)
               backgroundimage => array(1 item)
                  vDEF => '12' (2 chars)

编辑:图像

Answer 1

这很有趣。如果我尝试使用 TYPO3 Fluid ViewHelper:

<section style="background-image:url({f:uri.image(src: '{data.flexform_backgroundimage}', treatIdAsReference: 1)})">
    <article>
        <f:format.raw>{data.tx_gridelements_view_columns.100}</f:format.raw>
    </article>
</section>

我会得到一个错误你必须指定一个字符串 src 或一个 File 对象。

现在我使用vhs:

{namespace v=FluidTYPO3\Vhs\ViewHelpers}

<section style="background-image:url({v:uri.image(src: '{data.flexform_backgroundimage}', treatIdAsReference: 1)})">
    <article>
        <f:format.raw>{data.tx_gridelements_view_columns.100}</f:format.raw>
    </article>
</section>

一切正常.. here's the view helper reference vhs 扩展名。谢谢大家的帮助!