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

【问题标题】：How can I pass classes in to a section in liquid / shopify?如何将课程传递到 Liquid / shopify 中的某个部分？
【发布时间】：2019-08-16 05:03:51
【问题描述】：

例如传入一个sn-p

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

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

【问题讨论】：

标签： shopify liquid templating

【解决方案1】：

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

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

也就是说你可以稍微修改一下来实现你想要的。

例如：

节文件：

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' }}

【讨论】：