小编Tin*_*ant的帖子

我正在使用 shopify 并希望在变体选择器下拉列表中显示变体价格。Shopify 使用命名资产option_selection.js来实现变体选择功能。该资产是站点正常运行所必需的；但是，此资产会覆盖在product.liquid文件中创建的选择标记。

如果不option_selection.js包含，您可以简单地将变体价格添加到product.liquid文件中的每个选项。像这样的东西：

<div class="variants-wrapper clearfix {% if product.variants.size == 1 %}visuallyhidden{% endif %}"> 
    <select id="product-select" name="id">
        {% for variant in product.variants %}
            <option value="{{ variant.id }}">{{ variant.title | escape }} - {{ variant.price | money }}{% if variant.available == false %} - No Stock{% endif %}</option>
        {% endfor %}
    </select>
</div>

但是，option_selection.js启用后，此选择下拉列表将替换为另一个仅包含变体标题而没有其他信息的下拉列表。

经过一些试验和错误，我发现我可以使用以下代码段Shopify.Product.prototype.optionValues在直接放置在option_selection.js脚本标签之后的脚本标签中覆盖：

Shopify.Product.prototype.optionValues = function(o) {
  if (!Shopify.isDefined(this.variants)) return null;
  var t …