0

mi array de objetos:

    const [newe, setNewe] = useState([
        {uno:false},
        {dos:true, seg:false},
    ]);

deseo usar SetNewe para escribir un objeto sin eliminar los demás; ejemplo: quiero modificar la propiedad seg del objeto 1 en el array ¿Cómo se puede hacer esto sin eliminar el objeto 0?

2 respuestas 2

0

Intenta accediendo al índice que deseas modificar de la variable newe y luego le asignas el valor al state utilizando la funcion setNewe la misma referencia:

import React, { useState } from "react";

export default function App() {

 const [newe, setNewe] = useState([
        {uno:false},
        {dos:true, seg:false},
  ]);
  

  var modificar = () => {
    newe[0].uno = true;
    setNeww(newe); // < ----- la asignas el array modificado
  };

  return (
    <div >
      {newe.map((x) => {
        return <div>{x.uno}</div>;
      })}
      <button onClick={modificar}>Modificar</button>
    </div>
  );
}

2
  • El ejemplo no corre, da el error "Each child in a list should have a unique "key" prop", además se esta mutando el estado directamente.
    – g.4
    Commented el 18 ene. 2021 a las 17:06
  • SIIIII!!!!!!! Era tan simple como hacer esto: newe[0].uno = true; me funcionó exactamente como lo necesitaba muuuhcas gracias! Commented el 18 ene. 2021 a las 23:49
0

Si estas usando Babel que me imagino que si, puedes usar ES6+ de la siguiente forma.

export default function App() {
  const [state, setState] = useState({
    obj1: false,
    obj2: false,
    obj3: false
  });

  const handleClick = () => {
    setState({ ...state, obj2: !state.obj2 }); // propagación
  };

  return (
    <div>
      <div>
        <div>{`state obj1: ${state.obj1}`}</div>
        <div>{`state obj2: ${state.obj2}`}</div>
        <div>{`state obj3: ${state.obj3}`}</div>
      </div>
      <button onClick={handleClick}>change</button>
    </div>
  );
}

Lo anterior es un enfoque más limpio usando las bondades que nos trae los nuevos features de EcmaScript, acá usamos la propagación ...state para indicar que conserve todo lo que tiene tal como esta, pero modificando obj2.

Te dejo un DEMO en CodeSandbox

1
  • Muchas gracias, funciona el código pero yo tengo es un arreglo de objetos dentro de un array Commented el 18 ene. 2021 a las 23:29

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.