I'm currently facing an issue with filtering a nested array within an array of objects in Vue.js. Take a look at this snippet from my component code:
computed: {
filteredProducts: function () { // https://codepen.io/arhey/pen/QrbxdX
return this.products.map(product => {
return product.filter(p => {
return this.powers.includes(p.total_power_lamps);
});
});
}
},
The data is being filtered successfully, but the changes are not reflecting on the page.
filteredProducts: Array[6]
0: Array[2] <- Filtered!
1: Array[2] <- Filtered!
2: Array[0] <- Remove?
3: Array[0] <- Remove?
4: Array[0] <- Remove?
5: Array[0] <- Remove?
I am unable to update the data on the page as there are empty arrays present. How can I go about deleting these empty arrays?