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

79
Vistas
Reaccionar hacer que los elementos se intercambien en la lista 2

Estoy tratando de hacer un intercambio de elementos en 2 matrices. Hay 2 listas en la interfaz de usuario y el usuario selecciona los elementos en la primera lista, luego debe eliminarse de la primera lista y moverse a la segunda lista, donde se muestran los elementos seleccionados. El problema que tengo es que cuando trato de mover los elementos de la primera y segunda lista con setValue, no cambia el valor del valor. La función getIndexA funciona, la uso porque tengo una matriz de objetos y en la entrada como valor tengo una propiedad del objeto (la clave).

(Si imprimo la matriz antes de eliminar el objeto y después de eliminar el objeto, veo que la matriz está eliminando correctamente el objeto, pero cuando configuro ListaFile no cambia los valores de ListaFile (incluso si desmarco y vuelvo a verificar la entrada, veo que array2 está hecho de el elemento seleccionado e indefinido) por lo que parece funcionar, pero en el renderizado todavía veo la lista como la misma de inicio (incluso con un estado de uso conectado a listaFile con un registro de consola, no muestra el registro de consola de listaFile)

 const [fileSelezionati,setFileSelezionati] = useState([]); const [listaFile,setListaFile] = useState([]); function handleCheck(e){ if(e.target.checked){ var array = listaFile; var item = listaFile[getIndexA(listaFile,e.target.value)]; array.splice(getIndexA(listaFile,e.target.value),1); setListaFile(array); var array2 = fileSelezionati; array2.push(item); console.log("array2:",array2); setFileSelezionati(array2); } }

Esta parte está en la devolución()

 <ul> { listaFile.map((file,index)=>{ return <div key={file.key}><input type="checkbox" value={file.key} onChange={(e)=>handleCheck(e)}/> {file.key}</div> }) } </ul> <label>File selezionati:</label> <ul> { fileSelezionati.map((file,index)=>{ return <div><input key={file.key} type="checkbox" value={file.key} checked={true}>{file.key}</input></div> }) } </ul>
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Puedes hacerlo

 <ul> { listaFile.map((file,index)=>{ return <div key={file.key}><input type="checkbox" value={file.key} onChange={(e)=>handleCheck(file.key, e.target.checked)}/> {file.key}</div> }) } </ul> <label>File selezionati:</label> <ul> { fileSelezionati.map((file,index)=>{ return <div><input key={file.key} type="checkbox" value={file.key} checked={true}>{file.key}</input></div> }) } </ul>
 const [fileSelezionati,setFileSelezionati] = useState([]); const [listaFile,setListaFile] = useState([]); function handleCheck(key, checked){ if(checked){ const item = listaFile.find(f => f.key === key) setListaFile(listaFile.filter(f => f.key !== key)); setFileSelezionati([...fileSelezionati, item]); } }
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