Question

我试图用特定的滑块暗示lazyload，它要求输入图像的src两次，一次作为src，第二次作为数据惰性，如下所示：

<img src="domain.com/image.png" data-lazy="domain.com/image.png">

使用<f:image />我可以使用data="{lazy: 'domain.com/image.png'}"并重复使用viewhelper创建的图片的src ...（typo3 documentation和内联使用f:uri.image）< / p>

我实际上有两个问题：

如何嵌套f：uri.image？这会产生错误<f:image src="{image.uid}" treatIdAsReference="1" data="{lazy: '{f:uri.image(src: {image.uid})}'}"/>
它实际上应该是对它的反思图像，如果我嵌套f：uri.image我会创建第二个渲染图像吗？（特别是因为我还设置了宽度和高度，但我想保持片段简单）

该解决方案适用于TYPO3 v7和v8

Answer 1

试试这个

<img src="{f:uri.image(src : image.uid)}" data-lazy="{f:uri.image(src : image.uid)}" />

您不必使用<f:image ..>标记来创建＆lt; f：uri.image ..＆gt;返回相同的已处理资源。

Answer 2

循环：

<f:for each="{MARKER}" as="file">
<img class="lazy" src=".../blank.gif" data-lazy="{f:uri.image(image: file, width:'XXXc', height:'XXXc', treatIdAsReference:1)}" alt="{file.alternative}" title="{file.title}">
</f:for>

TYPO3 <f：image>嵌套viewhelper或以某种方式使用已处理的图像进行lazyload

2 个答案: