使用Cart.js和Rivets.js添加/删除购物车项目

时间:2019-02-28 01:20:22

标签: shopify liquid rivets.js

我在Shopify商店上使用的是cart.js,但无法获得增加/减少的数量或无法使用的功能。其他所有东西都正常工作,所以我不确定自己做错了什么。

我在 theme.liquid 上的结束</body>标签之前添加了以下代码。

{{ 'rivets-cart.min.js' | asset_url | script_tag }}

<script type="text/javascript">
    jQuery(function() {
        CartJS.init({{ cart | json }}, {
            "dataAPI": false,
            "requestBodyClass": "loading"
        });
    });
</script>

下面是我在 header.liquid 中拥有的代码...我也在product-template.liquid上对此进行了测试,但仍然得到相同的结果。

<div class="cart-product-wrap" rv-each-item="cart.items">

  <div class="cart-quantity">
    <a href="#" rv-data-cart-update="index | plus 1" rv-data-cart-quantity="item.quantity | plus 1">+</a>
    <div rv-text="item.quantity"></div>
    <a href="#" rv-data-cart-update="index | plus 1" rv-data-cart-quantity="item.quantity | minus 1">-</a>
  </div>

  <div class="cart-image"><img rv-src="item.image | productImageSize 'small'" src=""></div>

  <div class="cart-title-price">
    <div class="cart-title" rv-text="item.title"></div>
    <div class="cart-price" rv-html="item.price | money Currency.currentCurrency"></div>
    <div class="cart-remove"><a href="#" rv-data-cart-remove="index | plus 1">Remove</a></div>
  </div>

</div>

我遵循了https://cartjs-dev.myshopify.com/pages/guide上的指南,与工作示例没有任何区别。

有人知道我在做什么错吗?如何使它正常工作?

任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:1)

万一有人想知道,我通过将脚本更改为...来使它起作用...

<script type="text/javascript">
    jQuery(function() {
        CartJS.init({{ cart | json }}, {
        });
    });
</script>