I'm currently trying to develop a filtering system for a React e-commerce store. I have a list of products in an array, however when trying to filter by the filters requested, I get errors that: Uncaught TypeError: Cannot read properties of undefined (reading 'includes').
This is the product schema:
const ProductSchema = new mongoose.Schema({
title: {type: String, required: true, unique: true},
description: {type: String, required: true, unique: true},
image: {type: String, required: true},
categories: {type: Array},
sizes: {type: Array},
color: {type: Array},
price: {type: Number, required: true}
}, {timestamps: true});
This is the line of code where I'm trying to set filteredProducts to then map over each and display them:
useEffect(() => {
// category &&
setFilteredProducts(
products.filter((item) =>
Object.entries(filters).every(([key, value]) =>
item[key].includes(value)
)
)
);
}, [products, category, filters]);
I think what it is saying is that 'colors' and 'sizes' are not attributes of the product. For reference, this is the filters object that is passed through: {colors: 'black', sizes: 's'}.