Shopify：动态显示购物车的item_count

我们在标题中显示cart.item_count。这对大多数网页都很好。但是在一个页面上，我们动态地将商品添加到购物车，并且我们希望这些更改反映在标题中的购物车摘要中。Shopify：动态显示购物车的item_count

我在想我们需要RivetsJS才能工作;所以我们会有一个单向绑定。我尝试了几种方法：

<span rv-text="cart.item_count"></span>

和：

{ cart.item_count }

首先出现了空，显示的第二大括号和cart.item_count，从字面上。

我在做什么错？我需要在某处做一个rivets.bind（）吗？

来源

2015-03-24 NotoriousWebmaster

二是双花括号'{{cart.item_count}}' – Ronnie 2015-03-24 21:52:30

Double Curlies会被Liquid拾取，并在页面投放时呈现;他们没有得到我们在这里寻找的绑定。这就是我们原来的。现在我们需要动态绑定。 – NotoriousWebmaster 2015-03-24 21:54:46

你在液体模板中工作吗？ – Ronnie 2015-03-24 21:57:12

由于@ Ronnie评论过，您应该使用Shopify's Ajax API。

还有很多其他的问题&堆栈溢出的答案与如何做到这一点的例子，在这里只是几个：

For example：

$.ajax({ 
    type: 'GET', 
    url: 'http://your-store.myshopify.com/cart.json', 
    dataType: 'json', 
    success: function(data) { 
     var item_count = data.item_count; 

     // Update the item count in your header here... 
    } 
});

您也可以使用Shopify's jQuery wrapper library。见Shopify.getCart()：

// --------------------------------------------------------- 
// GET cart.js returns the cart in JSON. 
// --------------------------------------------------------- 
Shopify.getCart = function(callback) { 
    jQuery.getJSON('/cart.js', function (cart, textStatus) { 
    if ((typeof callback) === 'function') { 
     callback(cart); 
    } 
    else { 
     Shopify.onCartUpdate(cart); 
    } 
    }); 
};

来源

2015-03-24 23:53:57

是的，我正在使用第一个选项（w/$ .get（）），但它必须作为addItem的成功选项来完成;否则，item_count不能保证准确。但由于某些原因，它没有运行成功选项功能。 :(我希望我可以在评论中分享代码... – NotoriousWebmaster 2015-03-25 01:29:13

这是我现在的代码：http://pastebin.com/6VnaaRUC – NotoriousWebmaster 2015-03-25 01:36:05

@NotoriousWebmaster是失败的'$ .get（）'还是'addItem'？ – 2015-03-25 11:34:40

-1

试试这个：

<strong data-cart-render="item_count"></strong>

，并确保你的JS是这样的：

<script type="text/javascript"> 

    jQuery(function() { 
      CartJS.init({{ cart | json }}, { 
       "dataAPI": **true**, 
       "requestBodyClass": "loading", 
       rivetsModels: { 
       "customer": {{ customer | json }}, 
       "product": {{ product | json}}, 
       "cart" : {{ cart | json }} 
       } 
      }); 
    }); 

    </script>

来源

2016-05-05 03:42:47 user990717

Shopify：动态显示购物车的item_count

回答

相关问题