Greifen Sie auf Shopify-Varianten jedes Warenkorbartikels zu

Question

Zuallererst poste ich immer gerne funktionierende Beispiele, aber da es sich hierbei um eine Mischung aus js und serverseitiger Rendering-Flüssigkeit auf Shopify handelt, kann ich kein lauffähiges Beispiel bekommen.

In Shopify können Sie über Produktvorlagen auf product 对象，如下所示 {{ Product }} zugreifen.

Das

Cart-Objekt hat eines und das items 属性，它是购物车中所有商品的数组。购物车中的每个 item 对象与 product 对象不同。 product 对象有一个变体列表，而 cart item-Objekt nicht.

Der Zweck besteht darin, die Größe der Artikel im Warenkorb bearbeiten zu können.

Meine Frage ist, wie bekomme ich alle verlinkten Varianten? Sie müssen zum Produkt gehen und eine Liste aller darin enthaltenen Varianten erhalten. Holen Sie sich product_id aus den Varianten.

Der Grund, warum dies schwierig ist, liegt darin, dass Sie, wenn Sie die Get-Antwort für das Warenkorbobjekt erhalten, eine item 获得一个 product_id für jeden item im Warenkorb erhalten. Sie können das Produktobjekt jedoch nur dann abrufen, wenn Sie sich auf der Produktseite befinden.

Nur zur besseren Visualisierung des Warenkorbs, so:

{
  items: [
    {
      handle: 'product-handle',
      product_id: 123,
      variant_title: 'product variant'
    }
  ]
}

Was erledigt werden muss, ist:

{
  items: [
    {
      handle: 'product-handle',
      product_id: 123,
      /**
       * to get this you need first access to the product object from the product 
       * template. You could convert the product to json with a filter
       * e.g. const product = {{ product | json }} but you don't have the 
       * opportunity to be on the product template each time you edit a cart item
      */
      variants: [
        { color: 'white', size: 's' },
        { color: 'white', size: 'm' }
      ]
    }
  ]
}

Answer 1

如果您有产品 ID 或句柄，您可以随时致电 Shopify 以获取有关该产品的更多信息，例如分配给该产品的所有变体，以及所有选项。因此，要更改为不同的选项，您需要从购物车中删除变体 ID，然后添加您想要的不同的 ID。您可以使用 StorefrontAPI 调用来获取产品信息。这通常是商家做您需要做的事情的方式。

Answer 2

经过一整天的斗争，我终于明白了。对于曾经遇到过此问题的其他人，您需要执行类似的操作。

从购物车模板中，cart.liquid

const cart = (() => {
  const cart = {{ cart | json }}
  const items = []
  let variants

  {% for item in cart.items %}
    item = {{ item | json }}
    variants = []

    {% for variant in item.product.variants %}
      variant = {{ variant | json }}
      variants.push(variant)
    {% endfor %}

    item.variants = variants
    items.push(item)
  {% endfor %}
  cart.items = items

  return cart
})();

现在，对于购物车中的每个商品属性，您都有其变体。