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

回答

相關問題