UseState o UseReducer para administrar FormData
Tengo una pregunta, para procesar datos de formulario en reacción (por ejemplo, iniciar sesión, registrarse, datos de formulario de contacto), ¿es mejor usar el usuario o el estado de uso?
Ambos tienen ventajas y desventajas. Aquí hay información de los documentos :
- Tamaño del código: en general, con useState tiene que escribir menos código por adelantado. Con useReducer, debe escribir tanto una función de reducción como acciones de envío. Sin embargo, useReducer puede ayudar a reducir el código si muchos controladores de eventos modifican el estado de manera similar.
- Legibilidad: useState es muy fácil de leer cuando las actualizaciones de estado son simples. Cuando se vuelven más complejos, pueden inflar el código de su componente y dificultar el escaneo. En este caso, useReducer le permite separar claramente el cómo de la lógica de actualización del qué sucedió con los controladores de eventos.
- Depuración: cuando tiene un error con useState, puede ser difícil saber dónde se configuró incorrectamente el estado y por qué. Con useReducer, puede agregar un registro de consola en su reductor para ver cada actualización de estado y por qué sucedió (debido a qué acción). Si cada acción es correcta, sabrá que el error está en la propia lógica del reductor. Sin embargo, debe pasar por más código que con useState.
- Pruebas: un reductor es una función pura que no depende de su componente. Esto significa que puede exportarlo y probarlo por separado de forma aislada. Si bien generalmente es mejor probar los componentes en un entorno más realista, para una lógica de actualización de estado compleja puede ser útil afirmar que su reductor devuelve un estado particular para una acción y un estado inicial en particular.
- Preferencia personal: a algunas personas les gustan los reductores, a otras no. Esta bien. Es una cuestión de preferencia. Siempre puede convertir entre useState y useReducer de un lado a otro: ¡son equivalentes!
Recomendamos usar un reductor si a menudo encuentra errores debido a actualizaciones de estado incorrectas en algún componente y desea introducir más estructura en su código. No tienes que usar reductores para todo: ¡siéntete libre de mezclar y combinar! Incluso puede usar State y useReducer en el mismo componente.