I have an array of products that looks like this

I am trying to filter out products with a specific category,

 const filteredTrendingProducts = products.filter(
      (item) => item.data.category === "Kids"
    );

 setTrendingProducts(filteredTrendingProducts);

this returns and empty object yet I can clearly see in the array there is a data key and in data there is category.Why is the object returning empty?

>Solution :

Your logic is correct. Perhaps your program’s lifecycle is wrong.

When you have the wrong lifecycle, components might not have the correct data and still load. Because of this, perhaps, the data comes empty.