如何将 类 传递到 liquid / shopify 中的某个部分？
How can I pass classes in to a section in liquid / shopify?
例如传递一个片段
{% include 'icon-top', classes:'back-to-top__icon' %}
我可以将 class back-to-top__icon 传递到 icon-top 片段中
<svg class="icon {{ classes }}" somesvg stuff here ></svg>
对一个部分做同样的事情是行不通的 - 有什么方法可以在液体中做到这一点吗？
Sections 不接受节文件之外的任何内容。你可以把这个部分看成一个封闭的平台，里面或外面什么都没有。
这意味着创建的变量 outside/inside 该部分不可访问 inside/outside。
那是说你可以稍微修改它来实现你想要的。
例如：
节文件：
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 中捕获该部分，这将 return 部分的内容，我们可以在其中替换我们想要的任何内容。
这就是我们添加此 {{dummy_class}} 虚拟变量的原因。它包裹在液体中，但您可以将其视为文本而不是液体，因此我们也可以这样写 @dummy_class@。
之后我们只定位那个字符串并替换它{{ section_capture | replace: '{{dummy_class}}', 'back-to-top__icon' }}
例如传递一个片段
{% include 'icon-top', classes:'back-to-top__icon' %}
我可以将 class back-to-top__icon 传递到 icon-top 片段中
<svg class="icon {{ classes }}" somesvg stuff here ></svg>
对一个部分做同样的事情是行不通的 - 有什么方法可以在液体中做到这一点吗？
Sections 不接受节文件之外的任何内容。你可以把这个部分看成一个封闭的平台，里面或外面什么都没有。
这意味着创建的变量 outside/inside 该部分不可访问 inside/outside。
那是说你可以稍微修改它来实现你想要的。
例如：
节文件：
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 中捕获该部分，这将 return 部分的内容，我们可以在其中替换我们想要的任何内容。
这就是我们添加此 {{dummy_class}} 虚拟变量的原因。它包裹在液体中，但您可以将其视为文本而不是液体，因此我们也可以这样写 @dummy_class@。
之后我们只定位那个字符串并替换它{{ section_capture | replace: '{{dummy_class}}', 'back-to-top__icon' }}