Rivets.js IF对象存在

时间:2017-05-11 15:39:41

标签: javascript jquery html rivets.js

我有shopify的购物车。该对象如下所示:

{
  "attrs": {
    "line_items": [
      {
        "image": {
          "id": 19361216518,
          "created_at": "2016-10-03T11:50:25-05:00",
          "position": 1,
          "updated_at": "2017-02-03T17:11:13-06:00",
          "product_id": 8659646086,
          "src": "https://cdn.shopify.com/s/files/1/1481/5646/products/watermain-box.jpg?v=1486163473",
          "variant_ids": [

          ]
        },
        "image_variants": [
          {
            "name": "pico",
            "dimension": "16x16",
            "src": "https://cdn.shopify.com/s/files/1/1481/5646/products/watermain-box_pico.jpg?v=1486163473"
          }
        ],
        "variant_id": 30287712070,
        "product_id": 8659646086,
        "title": "Dome Water Main Shut Off Valve",
        "quantity": 1,
        "properties": {

        },
        "variant_title": "Default Title",
        "price": "99.99",
        "compare_at_price": null,
        "grams": 0,
        "shopify-buy-uuid": "shopify-buy.1494514993286.2"
      }
    ],
    "shopify-buy-uuid": "shopify-buy.1494514993286.1"
  }

一个看起来像这样的函数:

var updateCart = function() {
    var cart = localStorage.getItem(domeCart).toJSON();
        if (cart.lineItemCount != 0) {
            var shoppingCart = document.getElementById('shopping-cart');
            rivets.bind(shoppingCart,{cart:cart});
        }
    }

看起来像这样的购物车:

<div id="shopping-cart">
              <h3 class="empty-cart">Empty!</h3>
             <div class="top-cart-items items">
                <div class="top-cart-item clearfix">
                  <div class="top-cart-item-image">
                    <a href="#"><img src="images/shop/small/6.jpg" alt="Light Blue Denim Dress" /></a>
                  </div>
                  <div class="top-cart-item-desc">
                    <a href="#">Light Blue Denim Dress</a>
                    <span class="top-cart-item-price">$24.99</span>
                    <span class="top-cart-item-quantity">x 3</span>
                  </div>
                </div>
              </div>
              <div class="top-cart-action clearfix">
                <span class="fleft top-checkout-price">$114.95</span>
                <a href="https://test.myshopify.com/cart" class="button button-3d button-small nomargin fright cart-button">View Cart</a>
              </div>
              </div>   

我无法弄清楚如何使用铆钉检查对象是否为空,如果它是空的,请放<h2>Shopping cart empty</h2>但是如果它不是空的循环遍历所有购物车项目,将数据放在标记的可敬部分。

我查看了Rivets.js文档,但产品似乎没有很好的记录。任何帮助将非常感谢。

0 个答案:

没有答案