Complete Vue.js 2 Web Development_ Practical guide to building end-to-end web development solutions with Vue.js 2

(singke) #1
Building an E-Commerce Store - Browsing Products Chapter 10

if(!categories.hasOwnProperty(type.handle)) {
categories[type.handle] = {
title: type.title,
handle: type.handle,
products: []
}
}
});
}

Lastly, we need to append the current product handle onto the products array of the entry:


categories(state, payload) {
let categories = {};

Object.keys(payload).forEach(key => {
let product = payload[key],
type = product.type;

if(!categories.hasOwnProperty(type.handle)) {
categories[type.handle] = {
title: type.title,
handle: type.handle,
products: []
}
}

categories[type.handle].products.push(product.handle);
});
}

You can view the categories output by adding console.log to the end of the function:


categories(state, payload) {
let categories = {};

Object.keys(payload).forEach(key => {
...
});

console.log(categories);
}
Free download pdf