How do I display the remaining stock on the product page of the latest debut theme?

[smile_sain]

In the theme.js file shows that "variant.inventory_quantity" is not defined, how should I define it?  Can someone guide me?

[ybis96]

Hi smile_sain,

This thread should help you out. Happy coding!

[smile_sain]

I have tried this article on the debut theme before, and many of the errors are reported.

[smile_sain]

Add the following code to product-template.liquid, put the code at the bottom of the file:

<script type="application/json" id="VariantJson-{{ section.id }}">
[
{% for variant in product.variants %}
{
"incoming": {{ variant.incoming | default: false | json }},
"next_incoming_date": {{ variant.next_incoming_date | date: format: 'month_day_year' | json }},
"inventory_policy": {{ variant.inventory_policy | json }},
"inventory_quantity": {{ variant.inventory_quantity | json }}
}{% unless forloop.last %},{% endunless %}
{% endfor %}
]
</script>

Then add the following code to theme.js, search _initVariants: function() {this, above it:

addVariantInfo: function() {
if (!this.productSingleObject || !this.settings.stockSetting) {
return;
}

var variantInfo = JSON.parse(
$('#VariantJson-' + this.settings.sectionId).html()
);

for (var i = 0; i < variantInfo.length; i++) {
$.extend(this.productSingleObject.variants[i], variantInfo[i]);
}
},

This will not cause a variable error.