时间戳

首页 > 解决方案 > 如何将课程传递到 Liquid / shopify 中的某个部分？

shopify - 如何将课程传递到 Liquid / shopify 中的某个部分？

问题描述

例如传入一个片段

{% include 'icon-top', classes:'back-to-top__icon' %} 我可以将类 back-to-top__icon 传递到 icon-top 片段 <svg class="icon {{ classes }}" somesvg stuff here ></svg>

对一个部分做同样的事情是行不通的——有没有办法在液体中做到这一点？

标签： shopifyliquidtemplating

解决方案

节不接受节文件之外的任何内容。您可以将该部分看起来像一个封闭的平台，该部分内部或外部都没有任何东西。

这意味着在该部分外部/内部创建的变量在其内部/外部不可访问。

也就是说，您可以稍微破解它以实现您想要的。

例如：

部分文件：

test.section.liquid

节文件代码：

<div class="{{dummy_class}}"></div>

然后您以这种方式调用该部分：

<div style="display: none;">
  {% section 'test.section' %}
</div>

{% capture section_capture %}
  {% section 'test.section' %}
{% endcapture %}

{{ section_capture | replace: '{{dummy_class}}', 'back-to-top__icon' }}

澄清

你可能会问我们为什么要调用这个部分两次？

当我们在标签中调用该部分时，{% capture %}它不会显示在管理面板中，这就是为什么在隐藏的 div 中显示它只是为了在管理中显示它，而我们不对它做任何其他事情。

之后，我们在变量中捕获节section_capture，这将返回节的内容，我们可以在那里替换我们想要的任何内容。

这就是我们添加这个{{dummy_class}}虚拟变量的原因。它被包裹在液体中，但您可以将其视为文本而不是液体，因此我们也可以这样写@dummy_class@。

之后，我们只需定位该字符串并替换它{{ section_capture | replace: '{{dummy_class}}', 'back-to-top__icon' }}

推荐阅读