Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

128
Vistas
¿Por qué el estado no almacena los datos correctamente?

Estoy obteniendo datos a través de axios y almacenándolos en un estado

 useEffect(() => { getCartItems(); }, []); const [abc, setAbc] = useState([]); const getCartItems = async () => { let data = await CartApi.get(`/${store.getState().auth.user.id}/`) .then(({ data }) => data); console.log('data =>', data) data.map(a => setAbc([...abc, a.item])) }

Imprimo la variable de datos en la consola y da el siguiente resultado

datos

Pero después de eso data.item en otro estado, pero no está almacenando el primero. Si ejecuto console.log(abc) , muestra solo 24

a B C

Por qué no estoy recibiendo [32,24]

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Debido a que está reutilizando el mismo abc en cada una de esas llamadas a setAbc , por lo que solo se agrega el último de los elementos. Recuerda que el setter de estado no cambia la constante abc que estás usando, sino que programa una nueva llamada a la función de tu componente que obtendrá el nuevo valor para abc de useState .

Al actualizar datos basados en datos existentes, debe usar el formulario de devolución de llamada. Además, no hay razón para hacer llamadas setAbc repetidas, solo haga una con todos los datos nuevos, vea los comentarios *** :

 useEffect(() => { getCartItems(); },[]); const[abc,setAbc]=useState([]); const getCartItems = async () => { let data = await CartApi.get(`/${store.getState().auth.user.id}/`).then(({data})=>data); const items = data.map(({item}) => item); // *** Get the items setAbc(abc => [...abc, ...items]); // *** Save them // ^^^^^^−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−− *** Use the callback form }

(La solución principal es hacer [...abc, ...items] una vez . Aunque recomiendo usar la devolución de llamada, en muchos casos, simplemente setAbc([...abc, ...items]); también funciona siempre que no memorice getCartItems y esto solo se hace en el montaje o en respuesta a un clic del usuario o similar).

about 4 years ago · Juan Pablo Isaza Denunciar
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 Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda