I hope you are all well 🙂
I would like to ask something that (I hope) is basic, i have this function that is responsible for returning the filtered objects with a specific "key" variable that translates to color or size.
Well I put the color and size variables inside an array of objects, I would like to know what is the terminology I have to use now in my "item[key]" to be able to get to my "color" variable as shown in the last picture 😦
picture showing what key im able to get now and then what key im looking to get!
Thanks in advance for any and all help, have a nice day!
here is the code for the two functions used in this process:
const [filtros,setFiltros] = useState({});
const gerirFiltros = (evento) =>{
const valor = evento.target.value;
console.log(evento.target.name + evento.target.value)
if (evento.target.name === "cor" ) {
const cor = evento.target.name
setFiltros( {
...filtros,
["variacoes"]:[{
[evento.target.name]:valor
}],
})
}
else {
setFiltros({
...filtros,
[evento.target.name]:valor,
}) // THIS IS JUST TO PASS TO PAGE #2 (https://pastebin.com/4GH3Mi3H) THE VARIABLE `filtros` THAT IS AN ARRAY WITH MANY FILTERS LIKE -> {marca:"Paz rodrigues"}, etc..
And the functio that receives the filter ( the one i think i need to change) :
useEffect(() => {
categoria &&
setProdutosFiltrados(
produtos.filter((item) =>
Object.entries(filtros).every(([key,value],i) =>
//console.log("key ->" + key + "value->" + value[0].cor) )
item[key].includes(value)
)
)
)
You can use some()
useEffect(() => {
categoria &&
setProdutosFiltrados(
produtos.filter((item) =>
Object.entries(filtros).every(([key,value],i) =>{
//Here the value is an array 'variacoes' so to check colors use filter to get all the elements of 'variacoes' array;
//Also assuming that the color you are passing will be available here as item[key]
var allColors = item.map(i=>i.cor)
return value.some((val)=>allColors.includes(val.cor))
}
)
)
)