Estoy aplicando el siguiente filtro en una tabla con la ayuda de useEffect
useEffect(()=>{ let updated = data.filter(function(e){ if ((e.country === aaa|| e.country === undefined) && (e.age === bbb|| e.age === undefined)){ return true } }) setRows(updated) },[aaa, bbb])funciona bien cuando se selecciona "Seleccionar" para ambos filtros si uno de ellos no está definido, entonces no muestra ningún dato
Prefiero hacer múltiples funciones cuando los criterios de filtrado difieren. Es más legible para otros desarrolladores y más fácil de modificar y mantener.
No sé sobre el resultado final real ya que no conozco su caso de uso exacto. Pero esta estructura de código debería darle una pista sobre cómo abordar eso:
const byCountry = (country) => (item) => { return item.country === country || item.country === undefined; }; const byAge = (age) => (item) => { return item.age === age || item.age === undefined; }; const getUpdated = (data, country, age) => { return data .filter(byCountry(country)) .filter(byAge(age)); }; const data = [{ country: 'Finland', age: '42', }, { country: 'Sweden', age: '39', }, { country: 'Sweden', }]; console.log(getUpdated(data, 'Finland', '42')); console.log(getUpdated(data, 'Sweden', '39'));