• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

197
Vistas
¿Cómo detener los saltos del cursor hasta el final?

Estoy usando la biblioteca de entrada Antd, cada vez que escribo al principio o en medio de la palabra, mi cursor salta al final.

 const handleOpenAnswer =( key, value )=>{ handleFieldChange({ settings: { ...settings, [key]: value } }) } return ( <Input required size='default' placeholder='Label for Diference Open Answer Question' value='value' onChange={({ target: { value } }) => { handleOpenAnswer('differenceOpenAnswerLabel', value) }} />
almost 3 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

La razón por la que su cursor siempre salta al final es porque su componente principal obtiene un nuevo estado y, por lo tanto, vuelve a representar sus componentes secundarios. Entonces, después de cada cambio, obtiene un componente de Input muy nuevo. Por lo tanto, puede manejar el cambio de valor dentro del componente en sí y luego intentar pasar el valor modificado al componente principal después del cambio O (y realmente lo recomendaría) usar algo como React Hook Form o Formik para manejar sus formularios . Tratar con formularios por su cuenta puede ser (especialmente para formularios complejos y anidados) muy difícil y termina en problemas de procesamiento como los que enfrenta ahora.

Ejemplo en React-Hook-Form:

 import { FormProvider, useFormContext } = 'react-hook-form'; const Form = () => { const methods = useForm(); const { getValues } = methods; const onSubmit = async () => { // whatever happens on submit console.log(getValues()); // will print your collected values without the pain } return ( <FormProvider {...methods}> <form onSubmit={(e) => handleSubmit(onSubmit)(e)> {/* any components that you want */} </form> </FormProvider> ); } const YourChildComponent = () => { const { register } = useFormContext(); return ( <Input {...register(`settings[${yourSettingsField}]`)} size='default' placeholder='Label for Diference Open Answer Question' /> ) }
almost 3 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 Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda