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

99
Vistas
Cómo modificar atributos de estado con declaración de objeto en React desde la entrada de cadena

Estoy desarrollando una tabla para obtener la entrada del usuario. Por lo tanto, estoy usando textFields o autocompletar para obtener los valores y, según el valor, cambie el color del borde y el texto auxiliar. Mesa

Cada celda tiene su onChange:

 onChange={(e)=>{ setState(prevState=>({ ...prevState, runTimeStamp:{ ...prevState.runTimeStamp, helperText:state.runTimeStamp.evaluateHelperText(e.target.value), focused:true, error:state.runTimeStamp.evaluateHelperText(e.target.value)? true: false, color:state.runTimeStamp.evaluateColor(e.target.value, state.runTimeStamp.evaluateHelperText(e.target.value)? true: false) } })) }}

En este ejemplo, la columna es runTimeStamp. Me gustaría que se convierta en una función para tener dentro de onChange solo la devolución de llamada, así:

 onChange={InputChange}

¿Hay alguna manera de pasar el nombre de la columna como una cadena y convertirse en el genérico setState?

Ex:

 const InputChange =(e)=>{ let name = e.target.name setState(prevState=>({ ...prevState, runTimeStamp:{ ...prevState.name, helperText:state.name.evaluateHelperText(e.target.value), focused:true, error:state.name.evaluateHelperText(e.target.value)? true: false, color:state.name.evaluateColor(e.target.value, state.name.evaluateHelperText(e.target.value)? true: false) } })) }}

El estado es el siguiente:

 const [state,setState] =useState({ testName:{ defaultValue:file_name, }, runTimeStamp:{ helperText: '', error: '', color:'', focused: false, evaluateHelperText:(text)=>{ if (text === undefined || text === "") { return "Required" } else if (text.length < 3) { return "Name should contains at least 3 chars" } return false }, evaluateColor:(text,error)=>{ if(text==''){ return "warning" } else { return error? 'error':'success' } }, },
about 4 years ago · Juan Pablo Isaza
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