購入ボタンの表示をその商品がカートに入っているかどうかで条件分岐したい

日本語 ディスカッション 技術的なQ＆A
1

テーマDawnでタイトルのような実装をするためにmain-product.liquidで読み込んでいるbuy-buttons.liquidに下記のような実装をしました。

{% for line_item in cart.items %}
  {% if line_item.product_id == product.id %}
      （表示中の商品がカートに入っていたら表示したい処理）
  {% else %}
      （表示中の商品がカートに入っていなければ表示したい処理）
  {% endif %}
{% endfor %}

しかし表示中の商品がカートに入っているかにかかわらず何の表示もされません。

どうしたら希望の実装が出来るのでしょうか。

ご教示頂けると幸いです。

2

はじめまして。

株式会社ファイブビットの福水と申します。

上記のお悩みですが、私の環境からは、buy-button.liquid に上記のコードを読み込ませることで、意図した挙動になりました。

動画：https://gyazo.com/c0d7cf4e7781ae68a1a1cffed9b17241

コードの問題ではなく、テーマの設定などが問題かもしれません。

1 Like
3

@Anonymous_3b9a8e857ec4e2560bc009f074375383 様

ご確認頂き有難うございました。

私も時間をおいて上記処理をしたら表示されるようになりました。

ただ、for文の中で

{% if line_item.product_id == product.id %}

としているため、複数の商品が入っている場合に都度ifでの判定をしてしまい福水様の動画にもあるような「（表示中の商品がカートに入っていたら表示したい処理）（表示中の商品がカートに入っていなかったら表示したい処理）」と複数の表示が出てしまいました。

今回は「カートに入っていたら処理A」、「入っていなければ処理B」とどちらかのみを実行するようにしたいので、下記のようにカートに入っている商品idの配列を作成し、for文の外で配列中に表示中の商品が含まれているかどうかで条件分岐する形をとりました。

{% assign product_ids = "" %}
{% for line_item in cart.items %}
  {% assign product_ids = product_ids | append: line_item.product_id | append: "," %}
{% endfor %}
{% if product_ids contains product.id %}
  （表示中の商品がカートに入っていたら表示したい処理）
{% else %}
  （表示中の商品がカートに入っていなかったら表示したい処理）
{% endif %}

福水様の動画で複数商品をカートに入れてご確認頂いたのですぐに気づくことが出来ました。

ありがとうございました！

1 Like