• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

194
Vistas
Add and remove functions in javascript array (React-Hooks)

I have a filtering system where I use an array to add or remove the filtering methods. But my state is not working properly or i've missed something.

const [filters, setFilters] = useState([]);
const [creatorFilter, setCreatorFilter] = useState(null);

const handleCreatorFilter =(filter) => {
        setCreatorFilter(filter);

        if (filter === 'structures' && filters.indexOf(byStructureFilter) === -1) {
            setFilters([...filters, byStructureFilter]);
        }

        if (filter === 'members' && filters.indexOf(byMemberFilter) === -1) {
            setFilters([...filters, byMemberFilter]);
        }

        if (filter === 'all') {
            setFilters(filters.filter(el => el !== byStructureFilter || el !== byMemberFilter));
        }
    };

    const byStructureFilter = (item) => {
        return item.relationships.structure.data
    };

    const byMemberFilter = (item) => {
        return item.relationships.user.data && !item.relationships.structure.data
    }; 

Here the two buttons calling that handleCreatorFilter for filtering

<button onClick={() => creatorFilter === 'structures' ? handleCreatorFilter('all') : handleCreatorFilter('structures')}>Structures officielles</button>
<button onClick={() => creatorFilter === 'members' ? handleCreatorFilter('all') : handleCreatorFilter('members')} >Membres Wekomkom</button>

The things is for adding filtering methods to the array it works fine but not when the filter is set to all (removing the filtering methods). Do you see something wrong in my logic ?

almost 3 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda