如何访问液体中的 Shopify API 或液体中的 javascript 变量？答案

【问题标题】：How to access Shopify API in liquid or javascript variables in liquid?如何访问液体中的 Shopify API 或液体中的 javascript 变量？
【发布时间】：2016-12-23 03:06:17
【问题描述】：

据我所知，这似乎是不可能的。不过，一定有办法做到这一点。我想做的就是从 API 中获取一些信息，并将其传递给一个液体变量。也许还有其他方法。

【问题讨论】：

你最好描述一下你真正想要使用的信息。有时有一些方法可以获取特定信息，但没有通用解决方案（除了创建一个提取信息并将其写入主题 sn-p 的应用程序。）

标签： shopify liquid

【解决方案1】：

由于液体呈现服务器端，您无法将 javascript 变量传递到模板引擎。但是，您可以在 javascript 函数中嵌入流动模板代码。 shopify 论坛上有一个帖子，其中包含一些可能有帮助的示例代码：Pass variable from Java script to liquid?

例如：

 $(function() {
  new Shopify.OptionSelectors("product-select", { product: {{ product | json }}, onVariantSelected: selectCallback });

  // Add label if only one product option and it isn't 'Title'.
  {% if product.options.size == 1 and product.options.first != 'Title' %}
  $('.selector-wrapper:eq(0)').prepend('<label>{{ product.options.first }}</label>');
  {% endif %}

  // Auto-select first available variant on page load.
  {% assign found_one_in_stock = false %}
  {% for variant in product.variants %}
    {% if variant.available and found_one_in_stock == false %}
      {% assign found_one_in_stock = true %}
      {% for option in product.options %}
        $('.single-option-selector:eq({{ forloop.index0 }})').val({{ variant.options[forloop.index0] | json }}).trigger('change');
      {% endfor %}
    {% endif %}
  {% endfor %}

});

【讨论】：