Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

How do I fetch products data using product handle from an array containing handles? d

How do I fetch products data using product handle from an array containing handles? d

Itachi_Uchiha
Shopify Partner
26 0 1

I've a list of product handles stored in the main products metafield that I'm fetching in the following way:

 

{% assign firstComponentHandles = product.variants.first.metafields.custom.component_handles %}
const handlesData = {{ firstComponentHandles }};
console.log({handlesData}); 

Console log response:

{
    "handlesData": [
        "burger",
        "carbonated-beverage"
    ]
}

 
Now I've taken multiple approach to fetch the products data from the handles:

 

Using js:

{% assign firstComponentHandles = product.variants.first.metafields.custom.component_handles %}  
const handlesData = {{ firstComponentHandles }};
const componentsDataNew2 = [];

handlesData.forEach((componentHandle, index) => {

  componentsDataNew2.push({ "{{componentHandle}}": {{ all_products.componentHandle }} });

  componentsDataNew2.push({ "{{componentHandle}}": {{ all_products[componentHandle] }} });

});

Response:

Uncaught ReferenceError: EmptyDrop is not defined

Inspection on sources:

componentsDataNew2.push({ "": EmptyDrop });

componentsDataNew2.push({ "": EmptyDrop });



Using Liquid:

const componentsDataNew = [];
const componentsDataNew3 = [];

{% for handle in firstComponentHandles %}

  componentsDataNew.push({handle: {{ all_products.handle }}})
  componentsDataNew3.push({handle: {{ all_products[handle] | json }} });

{% endfor %}

console.log("Components Data Array New: ", componentsDataNew);
console.log("Components Data Array New 3: ", componentsDataNew3);


Response:

Components Data Array:  []
Components Data Array 3:  []

 

So, I couldn't fetch the data using either Js or Liquid. What am I doing wrong?

Thanks!

 



 

 

 

 

 

 

Reply 1 (1)

Itachi_Uchiha
Shopify Partner
26 0 1

It was a hectic process to solve the problem.

I've posted the answer here: https://stackoverflow.com/a/79068611/15338342