1

Tengo duda en como meter datos acumulados en react usando hooks dentro de un useEffect filtrando especificamente solo el id.

import {groups} from '../../database/groups';    
const [candidate, setCandidate] = useState({})

   useEffect(() => {
      groups.forEach(({id}) => {
         setCandidate({
            ...candidate,
            id
         })
         
      });
      
   }, [])

así es la data.

groups = [{
  id:"pan-anaya",
    "candidato": "RICARDO ANAYA CORTES",
    "partido": "PARTIDO ACCION NACIONAL",
  imagen: "pan.png",
    alt: "imagen del pan"
},
{
  id:"pri-meade",
    "candidato": "JOSE ANTONIO MEADE KURIBREÑA",
    "partido": "PARTIDO REVOLUCIONARIO INSTITUCIONAL",
  imagen: "pri.png",
    alt: "imagen del pri "
},]

El problema es que solo quedan los datos así, es decir solo mete el ultimo dato:

{id: 'pri-meade'}
   id: "pri-meade"
   [[Prototype]]: Object
4
  • Cuando dices datos acumulados, te refieres a popular un arreglo?
    – Jorius
    Commented el 22 sept. 2021 a las 21:25
  • si popular significa andar metiendo los datos como si fuera un push si Commented el 22 sept. 2021 a las 21:28
  • candidate no es un arreglo, es un objeto. Por eso no te funciona. Además, si necesitas meter todo lo de group dentro de tu state, porque simplemente no inicializas tu state con group de una vez? Commented el 22 sept. 2021 a las 21:32
  • a perdon el objeto en si es asi y solo queria el id pero elimine lo demas porque lo queria simplificar { id:"pan-anaya", "candidato": "RICARDO ANAYA CORTES", "partido": "PARTIDO ACCION NACIONAL", imagen: "pan.png", alt: "imagen del pan" }, Commented el 22 sept. 2021 a las 21:35

1 respuesta 1

1

Vamos por partes, si el arreglo de groups que estás importando lo necesitas alojar en un estado local de tu componente tienes varios errores:

// Si el arreglo groups que importas contiene la siguiente estructura:
const groups = candidate = [{
  id: 'pan-anaya',
  name: 'Pan-Anaya'
}, {
  id: 'pri-meade',
  name: 'Pri-Meade'
}]

// Cambia el objeto vacío inicial ({}) de tu estado local por un arreglo vacio ([])
const [candidate, setCandidate] = useState([])

// Luego en tu useEffect como componentDidMount
useEffect(() => {
  // Creamos un nuevo arreglo que solo nos retorne el id
  const newGroups = groups.map((group) => group.id)
  setCandidate(...newGroups )
}, [])

Ya deberías poder visualizar tu estado local candidate como un arreglo con los valores:

candidate = [{
  id: 'pan-anaya'
}, {
  id: 'pri-meade',
}]
7
  • si esta bien, pero me equivoque yo porque lo que queria era filtrar informacion que yo no puse pero que esta dentro de candidate que no lo quiero en el estado por ejemplo: { id:"pan-anaya", "candidato": "RICARDO ANAYA CORTES", "partido": "PARTIDO ACCION NACIONAL", imagen: "pan.png", alt: "imagen del pan" }, Commented el 22 sept. 2021 a las 21:37
  • solo quiero el id Commented el 22 sept. 2021 a las 21:37
  • Agrega la aclaración de solo querer el id en tu pregunta y ya edito mi respuesta para que te sirva :)
    – Jorius
    Commented el 22 sept. 2021 a las 21:38
  • ya esta editado gracias :). Commented el 22 sept. 2021 a las 21:40
  • 1
    @YahirAntonio listo, ya edité mi respuesta, espero te sirva
    – Jorius
    Commented el 22 sept. 2021 a las 21:52

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.