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

133
Vistas
How to decleare multiple state variables using loop - react state hook

I want to declare some state variable like : processId_1, processId_2, processId_3 ..... processId_n .

const [processId, setProcessId] = useState(0); I just want to use loop on the code to declare these variable. Something like that:

for (let index = 0; index < 30; index++) {
    const [processId["".concat("_",index)], setProcessId]["".concat("_",index)] = useState(0);
    
}

enter image description here

I also want to send them as props. How to do that.

about 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

It is possible to create an array of these states. So code would look like this:

const [processIds, setProcessIds] = useState([
    {
      id: '1',
      name: 'processId 1'
    },
    {
      id: '2',
      name: 'processId 2'
    }
]);

const handleClick = () => {
  setProcessIds([...processIds].map(pr => {
        if(pr.id === '1') {
          return {
            ...pr,
            name: 'processId is edited'
          }
        }
        else return pr;
      }))
}

<button onClick={handleClick}>
</button>

UPDATE:

It is possible to add keys into object dynamically like this:

const  obj = {};

for (let i = 10; i <= 20; i++) {
    obj['processId_' + i] = 0;
} 

An example:

const  obj = {};

for (let i = 10; i <= 20; i++) {
    obj['processId_' + i] = 0;
}    

console.log(obj)

about 4 years ago · Santiago Trujillo 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