Flujo de datos unidireccional en React

Al trabajar con React, puede encontrar el término Flujo de datos unidireccional. Qué significa eso?

El flujo de datos unidireccional no es un concepto exclusivo de React, pero como desarrollador de JavaScript, esta podría ser la primera vez que lo escuche.

En general, este concepto significa que los datos tienen una, y solo una, forma de transferirse a otras partes de la aplicación.

En React, esto significa que:

  • el estado se pasa a la vista y a los componentes secundarios
  • las acciones son activadas por la vista
  • las acciones pueden actualizar el estado
  • el cambio de estado se pasa a la vista y a los componentes secundarios

View-actions-state

La vista es el resultado del estado de la aplicación. El estado solo puede cambiar cuando ocurren acciones. Cuando ocurren acciones, el estado se actualiza.

Gracias a los enlaces unidireccionales, los datos no pueden fluir de manera opuesta (como sucedería con los enlaces bidireccionales, por ejemplo), y esto tiene algunas ventajas clave:

  • es menos propenso a errores, ya que tiene más control sobre sus datos
  • es más fácil de depurar, como sabesquéviene dedónde
  • es más eficiente, ya que la biblioteca ya sabe cuáles son los límites de cada parte del sistema

Un estado siempre es propiedad de un componente. Cualquier dato que se vea afectado por este estado solo puede afectar a los componentes debajo de él: sus hijos

El cambio de estado de un componente nunca afectará a su padre, ni a sus hermanos, ni a ningún otro componente de la aplicación: solo a sus hijos.

Esta es la razón por la que el estado a menudo se mueve hacia arriba en el árbol de componentes, de modo que se pueda compartir entre los componentes que necesitan acceder a él.

Descarga mi gratisReact Handbook


Más tutoriales de react:


Tech Wiki en línea!