現在Narrativeにて開発をしております。
行き詰まってしまい質問をさせていただきました。
バリエーションのサイズを変更した際に、商品説明の重量部分をそのサイズに対応した
重量に変更したいと考えております。
サイズと型番は公式（https://help.shopify.com/ja/manual/online-store/themes/os/customize/show-sku ）にあった方法で対応できたのですが、同じように重量も変更しようとしたら、初めは正しく表示されているのですが、サイズを切り替えると、undefined になってしまいます。
どのようにすればいいかご教示いただけますと幸いです。
現在の状況：
サイズ切り替え前
サイズ切り替え後
試したこと：
custom.jsに下記記述を追加
document.addEventListener('DOMContentLoaded', () => {
const productJson = [...document.querySelectorAll('[data-product-json]')];
if (productJson.length > 0) {
productJson.forEach((product) => {
const sectionId = "shopify-section-" + product.closest('[data-section-id]').dataset.sectionId;
const variantSKU = document.querySelector('#' + sectionId + ' .variant-weight');
const inputSelects = [...document.querySelectorAll('#' + sectionId + ' .single-option-selector')];
const productInfo = JSON.parse(product.innerHTML);
const inputValues = [];
const optionValues = [];
let count = 0;
inputSelects.forEach((input) => {
inputValues.push(input.value);
optionValues.push(count);
input.addEventListener('change', (evt) => {
const currentValue = evt.currentTarget.value.toString();
const changedIndex = inputSelects.indexOf(evt.target);
inputValues[changedIndex] = currentValue;
variantSKU.innerText = ' ';
productInfo.variants.forEach((variant) => {
if (JSON.stringify(variant.options) == JSON.stringify(inputValues)) {
variantSKU.innerText = variant.weight_in_unit;
}
});
});
count += 1;
});
});
}
});
カスタマイズにカスタムliquidを追加して記述記述しいます。
{% assign current_variant = product.selected_or_first_available_variant %}
<table>
<tr>
<th colspan="2">
仕様
</th>
</tr>
<tr>
<th>
サイズ
</th>
<td>
{% if current_variant.option1 == "Default Title"%}
W {{ product.metafields.my_fields.size_w.value }} x H {{product.metafields.my_fields.size_h.value}}
x D {{product.metafields.my_fields.size_d.value}}
{% else %}
{{ current_variant.option1 }}
{% endif %}
</td>
</tr>
<tr>
<th>
重さ
</th>
<td>
{{ current_variant.weight_in_unit }}
</td>
</tr>
<tr>
</tr>
<tr>
<th>
素材
</th>
<td>
{{ product.metafields.my_fields.sozai }}
</td>
</tr>
<tr>
<th>
内容物
</th>
<td>
{{ product.metafields.my_fields.naiyoubutu }}
</td>
</tr>
<tr>
<th>
特徴
</th>
<td>
{{ product.metafields.my_fields.tokutyou }}
</td>
</tr>
<tr>
<th>
型番
</th>
<td>
{{ current_variant.sku }}
</td>
</tr>
</table>
| 特記事項 |
| - |
| <br> <br><br> - {{ product.metafields.my_fields.tokkizikou }}<br><br> - 限定生産品です。突然の品切れによりご用意できない場合もあります。その際はご容赦ください。<br><br> - 改良のため、仕様を変更する場合があります。<br> <br><br> |