loadingloadingloadingloadingloadingloadingloadingloading loadingloadingloadingloadingloadingloadingloadingloading

* 応急処置程度の FIX です

まずはご覧ください

カート画面で数量変更すると金額表示がおかしくなる


おお ? ? ?

なにがどうなっているのでしょう

これは EC サイトとしてマズイ。

ということで調べてみました








どうやら ¥ のように $ と違って小数点の位置が違う通貨だと噛み合わなくておかしくなるみたいです。
theme.js を見てみましょう

itemPriceList.innerHTML = this._createItemPrice(
  item.original_price, // ← コイツです
  item.final_price
).outerHTML;

犯人はこの item.original_price くんでした。
item.final_price が 100 のフォーマットになっているのに対し、
item.original_price が 1.00 のフォーマットなので、
同じ金額のはずなのにディスカウントみたいになってたぽいです。
$1.00 と ¥100 みたいな。

対処法

theme.moneyFormat で現在の通貨フォーマットを取得して、¥ が文字列に含まれていれば item.original_price を100倍するようにしました。

console.log(theme.moneyFormat);

// => '¥{{amount_no_decimals}}'

最終コード

// 手前に追加
if (theme.moneyFormat.indexOf('¥') != -1 ) {
  item.original_price *= 100;
}

itemPriceList.innerHTML = this._createItemPrice(
  item.original_price,
  item.final_price
).outerHTML;

修正後

やったー直ったー
項目のラベルや合計金額などの要素が CSS クラス隠れていたので表示させました。


ただ、ダイレクトに表示金額操作しているのでちょっと危険な気が……
Shopify 側のアップデートでフォーマットが直って逆におかしくなる可能性も考えられます。
なので応急処置程度にとどめておいたほうが良いかと思います。


おしまい